SharedArrayBuffer以及跨域隔离

星沉轻舟
1,592 阅读3分钟

最近在使用插件的时候页面提示Your page is NOT cross-origin isolated(你的页面不是跨域隔离的)，查阅文档发现，是由于插件中使用了SharedArrayBuffer对象，作者为了能够正常使用此对象，判断了当前页面是否是跨域隔离的

什么是SharedArrayBuffer呢？

MDN文档给出的解释是

SharedArrayBuffer 对象用来表示一个通用的、固定长度的原始二进制数据缓冲区，类似于 ArrayBuffer 对象，它们都可以用来在共享内存（shared memory）上创建视图。与 ArrayBuffer 不同的是，SharedArrayBuffer 不能被转移。

简单来这个对象可以用来在网站的线程之间共享内存数据，由于JavaScript是单线程的，为了让浏览器能够更好地利用CPU的性能，让代码的编译以及运行效率更好，H5引入了web workers这个API，提供了多线程的使用方式。在默认情况下多个线程之间的数据是隔离的，如果要是用其他线程的数据，就必须将其复制过来，通过postMessage发送数据，为了解决这个问题，就出现了SharedArrayBuffer这个对象，这就让线程之间的通信效率变得更高。

为了应对幽灵漏洞(2018年发现的电脑漏洞，对CPU产生危害)，从2018年开始所有主流浏览器禁用SharedArrayBuffer，在2020年，通过标准化的方法重启SharedArrayBuffer。而使用对象的前提是，当前页面要处于安全上下文中，并且跨域隔离的环境中

安全上下文

安全上下文是 Window 与 Worker 中满足了最低标准的身份验证和机密性的概念。许多 Web API 仅能在安全上下文中访问。安全上下文的主要目标是防止中间人攻击者访问强大的接口，从而导致更加严重的破坏。

怎样的环境才是安全的呢？

  • 本地资源

    带有 http://127.0.0.1、http://localhost和http://*.localhost 的网址和 file:// 网址的资源

  • 非本地资源

    • 必须通过 https:// 或 wss:// URL 提供服务
    • 用于传送资源的网络信道的安全属性不能是废弃的

什么是跨域隔离

某些漏洞可能会通过一些web API攻击电脑，为了应对这些API带来的风险，浏览器提供了一个隔离环境，也就是跨域隔离，可以通过设置让页面进入跨域隔离环境

要进入跨域隔离，就需要在顶层文档的响应头上添加以下两个响应头

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp

Cross-Origin-Opener-Policy简称COOP，它会对当前的文档进行进程隔离，确保顶层文档不会与跨源文档共享同一个上下文它一共有三个值

  • unsafe-none：默认值，允许文档被添加到打开的窗口文档的上下文中
  • same-origin-allow-popups：保留打开窗口的引用，打开的引用要么没设置COOP要么设置为unsafe-none
  • same-origin：将浏览环境完全隔离于同一来源的文档。跨源文件不会在同一上下文中加载。

Cross-Origin-Embedder-Policy简称COEP，防止文档加载未明确授予文档权限，它有两个值

  • unsafe-none：这是默认值。允许文档获取跨源资源，而无需通过 CORS 协议或 Cross-Origin-Resource-Policy 头
  • require-corp：文档只能从相同的源加载资源，或显式标记为可从另一个源加载的资源。 如果跨源资源支持 CORS，则 crossorigin 属性或 Cross-Origin-Resource-Policy 头必须使用它来加载资源，而不会被 COEP 阻止

可以通过crossOriginIsolated来检查当前页面是否在跨域隔离的环境下，它将返回一个布尔值

或者在开发者工具的Application项中查看当前顶级文档的信息

image-20230103150016855.png

avatar
文章
阅读
粉丝