Nginx相关
一.常用命令(基于win10):
start nginx #启动Nginx nginx -s reopen #重启Nginx nginx -s reload #重新加载Nginx配置文件,然后以优雅的方式重启Nginx nginx -s stop #强制停止Nginx服务 nginx -s quit #优雅地停止Nginx服务(即处理完所有请求后再停止服务) nginx -t #检测配置文件是否有语法错误,然后退出
二.停止Nginx服务后,出现应用依旧可以访问现象
查找Nginx相关进程 tasklist /fi "IMAGENAME eq nginx.exe" 杀死该进程 taskkill /f /pid 21992
三.vue以根路径部署Nginx,其配置文件配置
upstream top { server 127.0.0.1:9000; #代理转发的地址1 } server { listen 9200; #监听端口 server_name 127.0.0.1; #监听ip location / { proxy_set_header Host $http_host; proxy_set_header Referrer $http_referrer; proxy_set_header Cookie $http_cookie; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; root G:/nginx-1.18.0/html/dist2; #前端包路径 index index.html index.htm; try_files $uri $uri/ /index.html; } location /top { proxy_pass http://top; index index.html index.htm; add_header Access-Control-Allow-Origin $http_origin; add_header Access-Control-Allow-Methods *; add_header Access-Control-Allow-Headers $http_access_control_request_headers; add_header Access-Control-Max-Age 3600; add_header Access-Control-Allow-Credentials true; if ($request_method = OPTIONS){ return 200; } proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } }
四.Nginx部署非根路径的vue项目
1.前端vue配置(3个地方)
①.src/router/index.js修改
②.vue.config.js修改
③.public/index.html修改:保证静态资源都可以被请求到
2.Nginx配置
upstream top { server 127.0.0.1:9000; #代理转发的地址1 } server { #hash模式,非根路径 listen 9400; server_name 127.0.0.1; #转发地址:top为后端接口请求文根 location ^~ /top/ { proxy_pass http://top; } location / { root G:/nginx-1.18.0/html/dist1; index index.html index.htm; try_files $uri $uri/ @router; } location @router { rewrite ^.*$ /index.html last; } location /topp { alias G:/nginx-1.18.0/html/topp; try_files $uri $uri/ /topp/index.html; index index.html index.htm; } }
3.前端打好包后,,将dist文件夹命名为topp文件夹,,并部署到nginx下,注意部署路径要和nginx中配置的路径一致,,重启Nginx,访问127.0.0.1:9400/topp即可访问
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 记一次.NET内存居高不下排查解决与启示