本文摘自PHP中文网,作者(*-*)浩,侵删。
前后端分离,使用nginx解决跨域问题前端:vue.js+nodejs+webpack
后台:SpringBoot
反向代理服务器:nginx
思想:将前端代码打包,让nginx指向静态资源,nginx对后台请求进行转发。
1、将前端代码打包:
1 |
|
会生成一个dist文件夹。包含一个index.html文件和一个static文件夹,路径以我本地为例:
/Users/xxx/ideaProjects/webtest/dist
2、打开
/usr/local/etc/nginx目录下的nginx.conf,在server中添加如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
|
测试
前端发送请求:http://localhost/test ,vue-router将其重定向为http://localhost/api/demo/1,实际访问是http://localhost:8080/demo/1。
直接向后台发送请求:访问http://localhost/api/demo/1,实际访问是:http://localhost:8080/demo/1
更多Nginx相关技术文章,请访问Nginx使用教程栏目进行学习!
以上就是nginx怎么解决跨域的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
关于linux下如何查看nginx的并发连接数和连接状态的详细介绍
更多相关阅读请进入《nginx》频道 >>