前端部署(vue3、nginx)
- pnpm build拿到dist静态包,如下图
- 准备nginx配置文件、证书等(如果不走域名可以不用),docker安装minio,如下图
- store(blog):静态资源(dist包内的文件)
- log:nginx日志
- conf.d(https.conf、minio.conf、cdn.conf):nginx配置文件
- cert:存放的证书
- nginx.conf:nginx公用配置
- install.sh:一键安装脚本
- https.conf如下
-
server { listen 80; server_name shizuka.icu; return 301 https://shizuka.icu/$request_uri; } server { listen 80; listen 443 ssl http2; server_name shizuka.icu; if ($server_port !~ 443){ rewrite ^(/.*)$ https://$host$1/dashboard permanent; } ssl_certificate cert/shizuka.icu.pem; ssl_certificate_key cert/shizuka.icu.key; ssl_session_timeout 5m; ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4; ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_prefer_server_ciphers on; location / { root /usr/share/nginx/blog/; try_files $uri $uri/ /index.html; index index.html; } location /status { stub_status on; } location /blog/api/v2/ { valid_referers shizuka.icu *.shizuka.icu; if ($invalid_referer) { return 403; } # forbidden Scrapy if ($http_user_agent ~* (Scrapy|Curl|HttpClient)) { return 200; } # forbidden UA if ($http_user_agent ~"Bytespider|FeedDemon|JikeSpider|Indy Library|Alexa Toolbar|AskTbFXTV|AhrefsBot|CrawlDaddy|CoolpadWebkit|Java|Feedly|UniversalFeedParser|ApacheBench|Microsoft URL Control|Swiftbot|ZmEu|oBot|jaunty|Python-urllib|python-requests|lightDeckReports Bot|YYSpider|DigExt|YisouSpider|HttpClient|MJ12bot|heritrix|EasouSpider|Ezooms|^$" ) { return 200; } # forbidden not GET|HEAD|POST method access if ($request_method !~ ^(GET|HEAD|POST)$) { return 200; } proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://shizuka.icu:9420; } location /cdn { valid_referers shizuka.icu *.shizuka.icu; if ($invalid_referer) { return 403; } proxy_pass https://cdn.bili.icu; } location /img/static/ { valid_referers shizuka.icu *.shizuka.icu; if ($invalid_referer) { return 403; } proxy_pass https://cdn.bili.icu/; } }
- install.sh内容如下(拉取nginx镜像、创建nginx容器)
docker pull nginx docker run -p 80:80 -p 443:443 --name nginx -v /usr/local/docker/install/nginx-install/store/:/usr/share/nginx/ -v /usr/local/docker/install/nginx-install/conf.d:/etc/nginx/conf.d/ -v /usr/local/docker/install/nginx-install/log:/var/log/nginx/ -v /usr/local/docker/install/nginx-install/cert:/etc/nginx/cert/ -v /usr/local/docker/install/nginx-install/nginx.conf:/etc/nginx/nginx.conf -d --restart=always nginx:latest
- 欢迎访问个人博客(前后端分离独立开发,vue + nestjs)