vue部署宝塔nginx配置(获取用户ip地址、反代理访问api接口、websocket转发)

以下配置为我自己的需求,因人而异,如果只是单纯的前端非交互页面,可以不用修改配置。

代码及注释,如下:

Puppet 复制代码
    #解决vue-router设置mode为history,去掉路由地址上的/#/后nginx显示404的问题
    location / {
      proxy_http_version 1.1;
      try_files $uri $uri/ /index.html;
    }
    
    #获取用户真实ip地址
    proxy_set_header Host $proxy_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

    #反向代理访问api接口
    location /api{
        proxy_http_version 1.1;
        rewrite ^.?api/?(.*)$ /$1 break; 
        include uwsgi_params;
        proxy_pass http://XXX.XXX.XXX.XXX:8888;
    } 

    #https下使用wss的websocket转发
    location /chat{
      proxy_pass http://175.XXX.XXX.XXX:8082;
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
      proxy_set_header X-real-ip $remote_addr;
      proxy_set_header X-Forwarded-For $remote_addr;
    }
相关推荐
传人once12 小时前
页面中心圆圈放大效果如何写
开发语言·javascript·ecmascript
用户0333074139512 小时前
TypeScript using 与 AsyncDisposableStack:在真实服务端代码中协调多资源清理
前端
web3d52012 小时前
Vue3 地图白屏排查清单:容器、弹窗与 ol-viewport 重复创建
vue.js·gis
daisychey12 小时前
用 Playwright 做多平台内容分发,我踩过的 8 个坑
前端
IT_陈寒14 小时前
为什么你应该学习JavaScript?
前端·人工智能·后端
大龄秃头程序员14 小时前
iOS冷启动监控Demo
前端
光影少年14 小时前
为什么 JavaScript 中 0.1 + 0.2 !== 0.3,如何让其相等?
前端·javascript·算法
掘金酱14 小时前
[稀土掘金 × 火山引擎] AI用量周榜冲刺赛|获奖名单公示
前端·人工智能·后端
泡泡oO15 小时前
“如果你还在用Superpowers,那我不要和你说话”
前端·后端·全栈
维克兜率天15 小时前
趋势过滤:避免被“假突破“反复打脸
前端