# 什么是同源策略？

1995年，同源政策由 Netscape 公司引入浏览器。目前，所有浏览器都实行这个政策。最初，它的含义是指，A网页设置的 Cookie，B网页不能打开，除非这两个网页"同源"。所谓"同源"指的是"三个相同"。

• 协议相同
• 域名相同
• 端口相同

# 非同源策略有三种行为限制

• Cookie、localStorage和indexDB 无法读取
• DOM 无法获得
• Ajax 无法发送

localStorage存储内存5M，超过2.5存在性能问题

# 浏览器不同的域名不能访问对应的cookie 但是内部的表单没有限制

# 如何设置同源策略（hosts）

test.xxxx.com a.html

<script>
    document.domain = 'xxxx.com'//设置同源策略
    document.cookie = 'test1=hello';
</script>

test.xxxx.com b.html

<script>
    document.cookie
</script>

注意，这种方法只适用于 Cookie 和 iframe 窗口，LocalStorage 和 IndexDB 无法通过这种方法

另外，服务器也可以在设置Cookie的时候，指定Cookie的所属域名为一级域名，比如.xxxx.com。

Set-Cookie: key=value; domain=.example.com; path=/

# 常见的解决跨域方案

img标签 iframe script jsonp(callback与后端进行约定) link(background)

# jsonp 原理

<script src="http://wwww.test.com/index.php?callback=test"></script>

<script>
function test(data){
    console.log(data)
}
</script>

php 部分
if(callback) {
    test({"data":"约定成功"})
}

# 标签拓展 测试用户网速，根据用户网速给出用户不同方案

var s = new Image()
var start = Date.now()
s.src = 'https://www.baidu.com/haha.gif'
s.onload = function() {
 var e = Date.now()
 var t = e-s
 var v = 't'+= 'kb/s'
}

# 一个html元素最少要当3个元素去使用

具体关于同源策略请浏览 阮一峰老师同源策略讲解