美文网首页
同源策略

同源策略

作者: 梦晓半夏_d68a | 来源:发表于2023-05-04 16:02 被阅读0次

同源策略

同源策略限制了从同一个源加载的文档或脚本如何与另一个源的资源进行交互。这是浏览器的一个用于隔离潜在恶意文件的重要的安全机制。注意是浏览器限制,服务端之间请求是没有跨域限制的。同源指的是指的是“三个相同”:协议、端口号、域名必须一致。

同源政策主要限制了三个方面:

1、当前域下的 js 脚本不能够访问其他域下的 cookie、localStorage 和 indexDB。

2、当前域下的 js 脚本不能够操作访问操作其他域下的 DOM。

3、当前域下 ajax 无法发送跨域请求。

同源政策目的

同源政策的目的主要是为了保证用户信息的安全,防止恶意的网站窃取数据,它只是对 js 脚本的一种限制,并不是对浏览器的限制,对于一般的 img、或者script 脚本请求都不会有跨域的限制,这是因为这些操作都不会通过响应结果来进行可能出现安全问题的操作。

不受同源限制

有三个标签是允许跨域加载资源:

  • <img src=XXX>
  • <link href=XXX>
  • <script src=XXX>

浏览器跨域问题

其实就是浏览器的同源策略造成的。跨域并不是请求发不出去,请求能发出去,服务端能收到请求并正常返回结果,只是结果被浏览器拦截了。

解决浏览器跨域问题

1、 通过jsonp跨域
2、 document.domain + iframe跨域
3、 location.hash + iframe
4、 window.name + iframe跨域
5、 postMessage跨域
6、 跨域资源共享(CORS)
7、 nginx代理跨域
8、 nodejs中间件代理跨域
9、 WebSocket协议跨域

详细办法参考

总结
简单的跨域请求jsonp即可,复杂的cors,窗口之间JS跨域postMessage,开发环境下接口跨域用nginx反向代理或node中间件比较方便。

CORS 报错案例

1、报错图片

问题分析1
问题分析2

相关文章

  • 什么是跨域请求

    什么是同源策略 ? 同源策略 同源策略 (Same-Origin Policy) 最早由 Netscape 网景公...

  • 同源策略 & 跨域

    同源策略 1.浏览器同源策略 同源策略(Same Origin Policy,SOP)也叫单源策略(Single ...

  • 绕过同源策略

    绕过同源策略 理解同源策略 Same Origin Policy , SOP。同源策略的含义就是对于不同的页面,如...

  • 同源策略&跨域

    同源策略&跨域 什么是浏览器同源策略? 同源策略(Same Origin Policy,SOP)也叫单源策略(Si...

  • 前端基础(问答23)

    keywords: 同源策略、跨域、jsonp。 什么是同源策略(same origin policy) 同源:协...

  • 【WEB】同源策略

    0x01 同源策略 什么是同源策略?简单来说,同源策略就是同协议、同端口、同HOST。同源策略限制从一个源加载的文...

  • 浏览器安全问题

    同源策略 同源即 同协议,端口,域名 同源策略的限制 不能获取不同源的cookie,LocalStorage 和 ...

  • 跨域请求

    同源策略 要理解跨域,就要了解“同源策略”。所谓同源是指,协议,域名,端口号相同。所谓“同源策略“,简单来说就是基...

  • 跨域

    什么是同源策略 同源策略(same origin policy),1995年同源政策由 Netscape 公司引入...

  • 浏览器同源策略和跨域方法

    什么是同源策略 同源策略 (Same-Origin Policy) 最早由 Netscape 公司提出, 所谓同源...

网友评论

      本文标题:同源策略

      本文链接:https://www.haomeiwen.com/subject/qdmxsdtx.html