nginx线上部署vue跨域
eg:
网站地址: baidu.com
后端api地址:api.baidu.com/api
vue修改target为:
```
proxy: {
"/api": {
target: baidu.com,
changeOrigin: true,
pathRewrite: {
"^/api": "api",
},
},
},
```
nginx配置:
```
server {
listen 80;
server_name baidu.com;
location / {
root /dist/html; //编译好的vue代码
index index.html index.htm;
}
location /api {
proxy_pass http://api.baidu.com/api;
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
```
方案2
```
server {
listen 8080;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root /usr/share/nginx/html;
add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
try_files $uri $uri/ /index.html;
}
location /api {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
rewrite ^/api/(.*)$ /$1 break; #重写
proxy_pass http://177.7.0.12:8888; # 设置代理服务器的协议和地址
}
location /api/swagger/index.html {
proxy_pass http://127.0.0.1:8888/swagger/index.html;
}
}
```