先解释何为同源:协议、域名、端口都一样,就是同源。
url | 同源 |
---|---|
https://niconico.com | 基准 |
https://niconico.com/spirit | o |
https://sub.niconico.com/spirit | x |
http://niconico.com/spirit | x |
https://niconico.com:8080/spirit | x |
你之所以会遇到 跨域问题,正是因为 SOP 的各种限制。但是具体来说限制了什么呢?
如果你说 SOP 就是“限制非同源资源的获取”,这不对,最简单的例子是引用图片、css、js 文件等资源的时候就允许跨域。
如果你说 SOP 就是“禁止跨域请求”,这也不对,本质上 SOP 并不是禁止跨域请求,而是在请求后拦截了请求的回应。这就就会引起后面说到的 CSRF
其实 SOP 不是单一的定义,而是在不同情况下有不同的解释:
下面是 3 个在实际应用中会遇到的例子:
<img>
)进行操作,在 canvas 操作图片的时候会遇到这个问题如果没有了 SOP:
SOP 带来安全,同时也会带来一定程度的麻烦,因为有时候就是有跨域的需求。绕过跨域的方案由于篇幅所限,并且网上也很多相关文章,所以不在这里展开解决跨域的方案,只给出几个关键词:
对于 ajax
对于 iframe