跨域问题的总结

一、跨域限制

1.跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。
2.同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生跨域——浏览器禁止页面加载或执行与自身不同域的脚本；
3.限制了什么
1.Cookie、LocalStorage、IndexedDB 等存储性内容
2.操作DOM 节点
3.Ajax请求发送后，结果被浏览器拦截了

二、跨域方法

（1）原理

浏览器——服务器之间存在跨域问题
服务器——服务器之间不存在跨域问题

服务器——设置允许访问
浏览器——代理服务器——服务器
JS标签——可跨域，函数包裹JSON

（2）方案

1.使用标签： img、link、script、iframe
2.使用方法：JSONP、CORS、niginx

JSONP——js跨域
1.Ajax不支持跨域、script标签可跨域
2.C——S C用js标签传递callback函数、S接收函数、包裹json数据
3.只能使用get方法,不符合业务逻辑

niginx——请求转发
1.服务器代理——配置niginx.config
2.本地端口拦截——本地路径配置location——代理服务配置（proxy_pass）——均衡负载设置（upstream）
反向代理、均衡负载（轮询-加权）、动静分离

cors——后台修改header
1.在后台服务器，对header对可访问域进行声明，允许跨域
2.header( “Access-Control-Allow-Origin”,"")，设置为，任意的域都可以进行访问

vue——重写webpack代理
1.启动本地nodejs ，对请求进行转发target:IP
2.客户端代理——vue.config
3. 配置重写webpack代理