项目场景:
vue express express-generator 使用ngnix转发 云服务器centos部署 注意
问题描述
在vue.config.js
设置端口,但是部署到服务器发现转发无效,expess的启动使用的是 宝塔面板的PM2启动。默认端口为3000
module.exports = defineConfig({
transpileDependencies: true,
lintOnSave:false,
devServer:{
'/api': {
target: 'http://localhost:3000/',
changeOrigin: true,
pathRewrite: {
'^/api': '',
},
}
// proxy:'http://localhost:3000'
}
})
原因分析:
使用nignix转发访问页面,指定index.html的文件夹
location / {
root `你的目录express-generator下生成`/public;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
但是没有对 express
请求的地址进行转发设置。导致依旧请求localhost/api/xxxxx
的默认端口请求,多半是80或8080
解决方案:
在ngnix中设置对api
地址请求的识别转发
location /api/ {
proxy_set_header Host $http_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://localhost:3000/;
}
其中3000端口
要根据你自己实际设置的express启动端口而选择
。