部署技巧——nginx（前端、图床等）

2024-09-07 248 words 2 minutes

Contents

nginx配置教程

1
2


cd /etc/nginx/conf.d
vim src/myblog.conf

输入以下代码:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


# myblog.conf
server {
    listen       port;
    server_name  localhost;
      
    location / {
        try_files $uri $uri/ =404;
        root /home/hxy/myblog/public;
        index index.html index.xml;
    }
}

nginx无法解析

没有赋予html目录权限一般放在/usr/share/nginx/xxx 若是其他目录，需要手动赋权。确保nginx用户可正常访问
域名解析错误
云服务器未打开

配置https

申请https证书免费获取证书 ohttps网站

1
2
3
4
5
6
7
8


server {
	listen 80;
	server_name your-domain;
	rewrite ^(.*)$ https://$host:443$1 permanent;
	location / {
    		proxy_pass http://localhost:port;
	}
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16


server {
    listen 443 ssl; 
    server_name blog.aiyin.club; 
    ssl_certificate path/aiyin.club.pem; 
    ssl_certificate_key path/aiyin.club.key; 
    ssl_session_timeout 5m;
    ssl_protocols TLSv1.2 TLSv1.3; 
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE; 
    ssl_prefer_server_ciphers on;

    location / {
        try_files $uri $uri/ @router;
        root  /path-to-html;
        index  index.html index.htm;
    }
 }

nginx搭建自己的图床

众所周知，图床有多种搭建方法，如oss、云开发托管等，而nginx+自己的服务器是一种轻便的图床搭建方法。

首先在服务器上选择一个放图片的目录，如~/imagehost
sudo vim /etc/nginx/conf.d/imagehost.conf 输入配置内容

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24


server {
    listen port;
    server_name  localhost;

    location / {
        index  index.php index.html index.htm;
    }
    
    error_page 500 502 503 504  /50x.html;
     
    location /imagehost/ {
        root /home/{username}/imagehost/; # 绝对路径
    }
}

# 将图床服务转发到子域名上 https://image.xxx.cn
server{
    listen 80;
    server_name image.xxx.cn;
    rewrite ^(.*)$ https://$host:443$1 permanent; # 自动https
    location / {
        proxy_pass http://localhost:port;
    }
}

访问https://image.xxx.cn/{filename}{suffix}，suffix为图片后缀，如.jpg、.png等

事实上，~/imagehost中还可存放其他任意文件。需要保证云服务器的带宽满足图床要求。

快速上传到自己的图床

编写后端上传接口，用apifox上传
使用picgo工具上传

编写.json文件。可存入C:\Users{username}.config\picgo目录

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


{
	"MyImagehost": {
		"url": "https://image.xxx.cn",
		"path": "/image/jxfruit/{fullName}",
		"uploadPath": "/home/hxy/imagehost/image/jxfruit/{fullName}",
		"host": {ip},
		"port": {port},
		"username": {username},
		"privateKey": {privateKey_path}
	}
}

开启一键上传

事实上，有诸多方法上传。仅需连接ssh + 移动文件 也可前端利用组件库完成快速上传。