vue打包后部署到nginx,跨域问题解决

1、目的:vue+springboot 开放的同学,使用nginx代理,实现前后台分离部署

2、问题:vue打包后的静态页面和文件直接由nginx代理访问没有问题,但是请求接口时是请求不到的。

3、解决方案:

a)配置nginx:

server {
        listen       80;
        server_name  localhost

        location / {
            root   D:/static; #vue工程打包后的文件路径
            index  index.html;
        }
    location /api/ {    # 会将接口地址/api开头的全部替换文下边配置的地址
        proxy_pass http://localhost:8081/;            #接口服务地址
    }


       
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }

b)vue 打包配置:

配置var baseUrl = '/api';

保证打包后,请求的接口地址以/ws 开头

vue打包后部署到nginx,跨域问题解决_第1张图片

4、结果:

请求成功。

vue打包后部署到nginx,跨域问题解决_第2张图片

 

 

你可能感兴趣的:(部署相关,java编码相关,接口相关)