说起前端跨域大家都知道,一般都是代理,然后跑起代理的服务和端口 如果不是vue项目,没有webpack可以设置代理的情况下,那跨域,后端又不给你解决怎么办呢,其实后端解决跨域,直接在统一接口调度的地方添加注解cross-origin,就可以,包括前端localhost,都能跨过去,我们公司就这样
那如果后端不搭理你,那就需要前端自己nginx跨域,方法也很简单 一:百度下载nginx包
二:nginx.conf配置跨域,在http server 里面添加配置
这样server_name启动加端口 192.168.4.85:8686就可以完美跨域
三:前面写个demo
目前只是解决当前代理服务下的跨域,如果另一个页面,端口不一样的情况下,跑起的项目 比如192.168.4.85:80/xx ,当前的方法怎么容易到项目中呢
四:那就需要把当前代理跑起的服务器** 192.168.4.85:8686/api** 放到另一个项目中请求,就间接的请求nginx配置的那个最终要代理的服务器上(依然不通)
四:可又遇到问题,既然域名都一样,端口不一样,又存在跨域怎么办,依然不通 就需要在配置个代理,让两个当前本地服务端口保持一样,需要配置代理
(这个是代理当前本地项目的地址,逆向:让外部跨域的域名端口和本地项目域名端口保持一样,代理本地项目域和路径来和外部的保持一致)
最终要保持你当前开发的项目和nginx启动服务器的地址域名端口一样,就可以像在nginx启动打开的服务环境下一样代理 1、保持url一样 nginx下:
当前项目下:
2、这样代理就可以一样了
最终打开当前本地项目http://192.168.4.85/wappay/xx/xx 就可以间接的让跨域转接上最终要代理的地方 www.fapiao.com/Entoaut 了, 然后在本地项目中开发就不受影响。