同源策略是什么？
同源策略是浏览器的一个安全功能，不同源的数据禁止访问。
所以 lilnong.top 下的 ajax 访问 51vv.com 数据是会报错。(network 可以看到 response，证明限制是浏览器方的限制)
当然，也有例外
- 表单提交、链接
这些项等同于切换页面
- script标签的src、link标签的href、img标签的src、iframe标签的src上述的资源可以引用，但是不可获取内容。
- img 可以显示出来，但是你无法放入canvas二次使用，会把canvas的源污染。
- iframe 可以显示，不可以获取DOM
- script 不可获取报错代码位置。
同源的定义
端口、域名、协议 都相同，定义为同源。
针对http://www.lilnong.top/static这个地址来说。端口（80），域名（www.lilnong.top）,协议（http）
| URL | 端口 | 域名 | 协议 | 描述 |
https://www.lilnong.top |
80 | www.lilnong.top | https | 协议不同，不同源 |
http://lilnong.top |
80 | lilnong.top | http | 域名不同，不同源 |
http://lilnong.top:8080 |
8080 | lilnong.top | http | 域名不同，端口不同，不同源 |
http://www.lilnong.top:8080 |
8080 | www.lilnong.top | http | 端口不同，不同源 |
http://www.lilnong.top/ |
80 | www.lilnong.top | http | 同源 |
http://www.51vv.com |
80 | www.51vv.com | http | 域名不同，不同源 |
为什么要有同源策略
- 安全问题
例子1：普通的网络用户，不会去记域名等内容。如果我在我自己的页面内，嵌套一个<iframe src="taobao.com">并把他放大，不就和淘宝一模一样了？并且还会有淘宝的状态信息。
这时候我们可以获取用户的密码、给用户创建订单、注销用户的账户等等有危害性的操作。
例子2：领导说要一个腾讯新闻。嗯好，我们<iframe src="news.qq.com">放大自适应。
这时候，我们可以加点小广告，截获一些用户操作。分分钟不花钱。得到了一个腾讯新闻。
- 数据归属问题
- 想起来前几天在思否看到的头条（“饭友”APP 未经许可抓取微博数据，被判赔偿210万）。
如果说没有同源策略，饭友直接 ajax 拉取微博数据。或许你可以说 referer 验证，在浏览器没有同源策略的情况下这些都可以绕过去。
微博方看到的就是一个正常的微博用户，正常的ip，访问了他们的接口。
总结
同源策略是蛮好的，防御了大部分的攻击。但是合理是合理，一些特殊情况下我们也是要绕过这个策略，下节我们讲跨域。
