vue 项目配置:
打包后的环境配置,将后台请求接口设置成VUE_APP_API_BASE_URL=/api
,/api 在nginx 中做实际的转发,详见【nginx配置】
参照自己的后台请求接口设置,本文的后台请求最终都会通过gateway在进行一次转发具体的微服务
NODE_ENV=production
VUE_APP_PREVIEW=false
VUE_APP_API_BASE_URL=/api

nginx 配置:
server {
listen 10280;
server_name localhost;
# 允许请求地址跨域 * 做为通配符
add_header 'Access-Control-Allow-Origin' '*';
# 设置请求方法跨域
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
# 设置是否允许 cookie 传输
add_header 'Access-Control-Allow-Credentials' 'true';
# 设置请求头 这里为什么不设置通配符 * 因为不支持
add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Data-Type,X-Requested-With,X-Data-Type,X-Auth-Token';
# vue 打包的dist文件路径
root D:/myWeb/dist;
location / {
index index.html index.htm;
try_files $uri $uri/ @router;
}
location @router {
rewrite ^.*$ /index.html last;
}
# 后台请求接口转发到接口地址(gateway 地址)
location /api {
#add_header 'Access-Control-Allow-Origin' '*';
#add_header 'Access-Control-Allow-Methods' 'POST,GET,OPTIONS';
proxy_pass http://localhost:10200;
}
# 设置 options 请求处理
if ( $request_method = 'OPTIONS' ) {
return 200;
}
}
网友评论