如何在Microsoft Edge Javascript中启用SharedArray Buffer

Question

所以前几天，我问了一个关于javascript webworkers的问题：Javascript Webworker如何将json信息放入数组缓冲区。我得到的答案之一是使用SharedArrayBuffer在主javascript和webworker之间共享内存。我知道有一段时间，这在微软边缘上是可用的，但出于安全考虑，不久前被禁用了。我的边缘版本是96.0.1054.62。是否有任何方法可以在浏览器配置或设置中启用共享数组缓冲区？目前，当我尝试使用它时，它说SharedArrayBuffer是未定义的。

Answer 1

为了启用共享阵列缓冲区支持，您的网页需要处于安全的上下文中。为此，您需要服务器提供以下标头：Cross-Origin-Opener-Policy: same-origin和Cross-Origin-Embedder-Policy: require-corp。你可以在MDN 上阅读更多关于它的信息

建议更改服务器上的标头，但如果您根本无法管理服务器上的标题，则可以通过Service Worker对其进行修改。这篇博客文章描述了在ServiceWorker中通过修改头来启用SharedArrayBuffer。它按以下顺序工作：

1. 首次加载页面时，将注册服务工作程序
2. 页面已重新加载
3. SharedArrayBuffer变为可用，因为ServiceWorker控制所有请求的所有CORS头

ServiceWorker通过添加CORS/COEP头来修改所有请求(示例取自上述博客文章(：

self.addEventListener("install", function() {
self.skipWaiting();
});
self.addEventListener("activate", (event) => {
event.waitUntil(self.clients.claim());
});
self.addEventListener("fetch", function(event) {
if (event.request.cache === "only-if-cached" && event.request.mode !== "same-origin") {
return;
}
event.respondWith(
fetch(event.request)
.then(function(response) {
// It seems like we only need to set the headers for index.html
// If you want to be on the safe side, comment this out
// if (!response.url.includes("index.html")) return response;
const newHeaders = new Headers(response.headers);
newHeaders.set("Cross-Origin-Embedder-Policy", "require-corp");
newHeaders.set("Cross-Origin-Opener-Policy", "same-origin");
const moddedResponse = new Response(response.body, {
status: response.status,
statusText: response.statusText,
headers: newHeaders,
});
return moddedResponse;
})
.catch(function(e) {
console.error(e);
})
);
});