vue+nginx代理实现打包部署生产环境的跨域问题
最近用vue开发前端,在开发过程中使用vue自带的代理工具进行访问后台代码,这个过程一直没有问题,但是打包之后放到服务器上出现请求访问跨域的问题,在网上查找解决方案的过程中发现主要有两种解决方案:(1)把文件请求路径修改成相对请求路径,然后把打包好的dist文件下放到后台项目的webapp文件夹下,然后这样访问就不存在跨域问题了;(2)使用nginx代理实现请求,下载nginx,然后修改配...
·
最近用vue开发前端,在开发过程中使用vue自带的代理工具进行访问后台代码,这个过程一直没有问题,但是打包之后放到服务器上出现请求访问跨域的问题,在网上查找解决方案的过程中发现主要有两种解决方案:
(1)把文件请求路径修改成相对请求路径,然后把打包好的dist文件下放到后台项目的webapp文件夹下,然后这样访问就不存在跨域问题了;
(2)使用nginx代理实现请求,下载nginx,然后修改配置文件nginx.conf:主要修改内容是如下
因为我的vue中的请求路径设置是
所以我使用/api/来捕捉请求,当捕捉到请求是/api/时,把请求切换成proxy_pass对应的http://10.0.41.47:8080/,这样就可以访问到了(/api/中后面的斜杠这个坑花费了我一天的时间,之前一直没有加,代理跨域一直失败提示404,后来在/api后面加上/,并在proxy_pass对应的http://10.0.41.47:8080后面也加上了斜杠就解决了问题)
最后总结下,第二种方法比第一种方法好的地方在于开发和生产环境的请求路径设置成一样的就可以,不用再进行修改
更多推荐
已为社区贡献6条内容
所有评论(0)