一、同源策略
1、定义：
同源策略即协议、域名、端口都要相同。不同源的客户端脚本在没有授权的情况下，不能读取对方的资源。
2、目的：
保证用户信息安全，防止恶意网站窃取数据。
3、哪些行为受同源限制：
cookie、webStorage、indexDB
DOM、iframe对象无法读取
ajax不能发送请求 （报错：。。。No 'Access-Control-Allow-Origin'...)
4、哪些行为不受同源限制：
script标签、img标签、link标签
页面中的链接、重定向、表单提交
二、跨域
当我们去访问一个不同源下的资源的时候就会产生跨域。
解决跨域的方法：
客户端与服务器端之间：
1、（后端）服务器配置cors,跨域资源共享；使用自定义的http头部，让浏览器与服务器进行沟通。
res.header("Access-Control-Allow-Origin", "*"); //设置请求来源不受限制
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS"); //设置请求方式
2、（后端）nginx反向代理（服务器之间没有同源策略的限制）
3、jsonp，利用script标签可以跨域的特性，只能使用get方法，不安全。
4、如果使用webpack的话，修改webpack选项devServer的代理功能proxy：
proxy:{
'/api':{
target:'', //请求的实际地址
changeOrgin:true, //是否跨域
/''/
pathRewrite: { //将/api 替换为空
'^/api':''
}
}
}
客户端之间：
1、html5 postMessage(),客户端之间传递数据
window.onload = function() {
var ifr = document.getElementById('ifr');
var targetOrigin = "http://www.google.com";
ifr.contentWindow.postMessage('hello world!', targetOrigin);
};
2、document.domain（对于具有相同上级域名的情况，document.domian='baidu.com')，这时浏览器会认为他们都处于同一个域下。问题：当其中一个站点被攻击后，另一个站点也会有安全漏洞。