前端跨域,nginx反向代理的解决方案
现在越来越多的公司开始使用前后端分离的技术,而盲目的分离是不理智的,跨域也是第一难题。我的第一份工作就是公司第一个以前端开发者的身份入职,此时公司所有的项目都已正式运行了(项目太多,结构复杂,团队分散,后台不能改)
先了解一下为什么跨域:
1.浏览器先根据同源策略对前端页面和后台交互地址做匹配,若同源,则直接发送数据请求;若不同源,则发送跨域请求。
2.服务器解析程序收到浏览器跨域请求后,根据自身配置返回对应文件头。若未配置过任何允许跨域,则文件头里不包含Access-Control-Allow-origin字段,若配置过域名,则返回Access-Control-Allow-origin+ 对应配置规则里的域名的方式。
3.浏览器根据接受到的http文件头里的Access-Control-Allow-origin字段做匹配,若无该字段,说明不允许跨域;若有该字段,则对字段内容和当前域名做比对,如果同源,则说明可以跨域,浏览器发送该请求;若不同源,则说明该域名不可跨域,不发送请求
总结一下跨域的原因就是一句话:不同IP或不同端口就是跨域。想了解更详细的可以去查查别人的资料。
所以想要解决跨域的方法就是让服务器追加该前端的域名。
后台不加怎么办?以下就是解决方案之一:
让前端页面和后台交互地址同源。
Nginx代理方式
这里所说的代理是指前端的代理,跟后端没什么关系
修改nginx.conf配置文件
server {
listen 80;
server_name http://localhost;
location / {
root D:\test;
index index.html index.htm;
}
}
这里是代理了一个本地项目,开通80端口访问,root是本地项目路径,index是项目的入口文件。
我只贴了主要的地方,404、500之类的东西可以参考别人或看官方文档。
如果你