标签：user 之间 多个 origin ios 不同 sha for www
（1）考察目标
1）跨域出现的原因
2）解决的跨域的方式有哪些。
（2）题目分析
1）跨域出现的原因：同源策略。
什么是同源策略：同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互，同源三要素：协议、端口、域名。当一个请求url的协议、域名、端口**三者之间任意一个与当前页面url不同即为跨域。请求就不被允许。
2）解决的跨域的方式有哪些
反向代理跨域
CORS跨域
CORS 是跨域资源分享（Cross-Origin Resource Sharing）的缩写。
它是 W3C 标准，属于跨源 AJAX 请求的根本解决方法。
普通跨域请求：只需服务器端设置Access-Control-Allow-Origin
带cookie跨域请求：前后端都需要进行设置
前端设置：
// 前端设置：根据xhr.withCredentials字段判断是否带有cookie
// 原生ajax
var xhr = new XMLHttpRequest()
xhr.withCredentials=true
xhr.open(‘post‘,‘http://www.domain2.com:8080/login‘,true)
xhr.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded‘)
xhr.send(‘user-admin‘)
xhr.onreadystatechange = function(){
if(xhr.readyState===4&&xhr.status==200){}
}
// jQuery的ajax
$.ajax({
url:‘http://www.text.com:8080/login‘,
type:‘get‘,
data:{},
xhrfields:{withCredentials:true},
crossDomain:true// 会让请求头中包含跨域的额外信息，但不包含cookie
})
// axios
axios.defaults.withCredentials=true
服务端设置(node）：
// node服务端设置
res.writeHead(200,{
// 后端允许发送cookie
‘Access-Control-Allow-Credentials‘:‘true‘,
// 设置允许访问的域
‘Access-Control-Allow-Origin‘:‘http://www.domain1.com‘,
‘Set-Cookies‘:‘l=a123456;Path=/;Domain=www.domain2.com;HttpOnly‘,
})3）jsonp跨域
JSONP是服务器与客户端跨源通信的方法之一，最大特点就是简单，缺点是只支持get请求
核心思想：网页通过添加一个script元素，向服务器请求JSON数据，服务器将数据放在一个指定名字的回调函数的参数位置传回来
（3）应用场景
一般在vue项目中最主要的方式就是使用devServer的反向代理。
当使用多个地址也可以通过后台cors配置跨域。
另外也可以通过nginx进行代理。
视频地址：
https://p.bokecc.com/qrplay.bo?uid=78665FEF083498AB&vid=C6332E4A7DA07F4E9C33DC5901307461
标签：user 之间 多个 origin ios 不同 sha for www
原文地址：https://www.cnblogs.com/yihengbaobei/p/12863574.html
