在学会了HTTP数据包的拦截和修改之后，你可能观察到了不少网站的一些接口信息。

而浏览器为了保证用户隐私以及其它因素考虑，对于网络接口的调用有一层屏障，这层屏障称为同源策略。那么今天我们就来学习这个同源策略，希望能提升大家对于接口的测试和利用水平。

首先说说为什么存在同源策略，我们知道JavaScript可以操作html，可以发出请求，也可以用iframe加载别的网站。

那么试想一下，你登陆了一个购物网站比如京东，接着去访问了pockr社区。如果pockr社区利用JavaScript给京东的收货地址url发起了请求，从原则上讲，这个请求不会成功，否则你的隐私就泄露了。那么控制这个请求的成功与否，就叫同源策略。

同源策略的规定可以概括成：不同域的客户端脚本在没明确授权的情况下，不能读写对方的资源，主要有三要素：协议相同、域名相同、端口相同。

我以https://pockr.org/activity 这个url给大家举个例子，

参照URL https://pockr.org/activity (https://www.pockr.org/activity)对比URL 是否同域：

原因

https://www.pockr.org/activity 对比  (https://pockr.org/activity)  答案：否

www.pockr.org是二级域名,pockr.org是根域名

http://www.pockr.org/activity  对比 https://pockr.org/activity) 答案：否 

http是80端口,https是443端口,端口号不同

https://pockr.org/activity 对比 https://pockr.org/bug-environment 答案：是 

协议相同,域名相同，端口相同，是同源，只是路径不path部分不同而已

那么跨源会发生什么呢？我给大家举个例子：

现在我们访问 https://pockr.org/

接着我们用JavaScript脚本请求一下 https://www.pockr.org 这个不同源的地址。

(浏览器控制台植入JavaScript)

可以看到浏览器控制台报了一个错误,（原因：CORS 头缺少 'Access-Control-Allow-Origin'）,提示非常明显

我们用抓一下数据包看看，首先给大家介绍一下,破壳用的是https协议,直接用burp抓包的话会提示不安全,这是因为burp作为代理,替换了破壳的ssl证书,这时候只需要访问http://burp , 下载burp的证书然后导入浏览器就可以成功抓取https的数据了

那么我们再来抓一次这个跨域请求观察一下。首先可以看出请求是往外发的，因为burp拦截到对外发送的数据包

同时我们看下返回内容，那么我们根据报错,在返回数据包中加上一个错误提示里缺失的http头会有什么效果呢?

可以看到报错消失了,请求得到了响应，那么就是说浏览器拦截了跨源请求的返回结果

这个例子说明了：虽然有同源策略在，但是是可以协商的。只要被请求的一方用某种方式允许了你访问，就可以突破同源策略的限制。

接下来我们看一些业务上常见的允许跨源访问的例子

1.jsonp

jsonp的本质是跨源的对方给你一段JavaScript脚本让你执行,而script标签的src属性是允许跨源的,所以达到了跨源的目的

给大家演示一下

可以看到，127.0.0.1:9999这个源下面的html 创建了一个script标签,利用src属性,通过url传递数据给test.shuimugan.net，test.shuimugan.net则返回了一个JavaScript脚本给127.0.0.1:9999执行,两个源之间达到了数据交互

2.CORS

CORS的原理就是刚刚我们操作修改HTTP响应的过程，是被请求的服务端获取到发出请求方的请求后，决定给响应头加上了Access-Control-Allow-Origin相关的信息，浏览器就会对响应放行，让请求方拿到数据。

3.WebSocket

WebSocket是一种通信协议，使用ws://（非加密）和wss://（加密）作为协议前缀。该协议不实行同源政策，只要服务器支持，就可以通过它进行跨源通信。

可以看到我们127.0.0.1:9999毫无报错就可以通过ws协议给test.shuimugan.net:8081发信息

那么常见业务的跨源场景就讲解到这里啦~