vue项目部署的时候需要使用nginx做反向代理,因为开发的时候我们使用的是webpack提供的proxyTable做的代理从而解决了开发环境的跨域请求问题。
使用nginx反向代理,解决Vue项目部署跨域问题
配置nginx
server {
listen 80;
#listen [::]:80;
server_name www.sfjvipc.om ;
index index.html index.htm index.php
root /home/wwwroot/sfjvip;
location / {
try_files $uri $uri/ @router;
index index.html;
}
location @router {
rewrite ^.*$ /index.html last;
}
location ^~ /api/ {
proxy_set_header Host $host;
# 存放用户的真实ip
proxy_set_header X-Real-IP $remote_addr;
# 每经过一个反向代理,就会把反向代理IP存放在X-Forwarded-For里
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
#node api server 即需要代理的IP地址
proxy_pass http://127.0.0.1:9188/;
}
}