0

我有一个基于 Express (Node) 构建的已部署应用程序，并使用内置的 React 前端进行应用程序渲染。

目前，我面临 SharedArrayBuffer 问题，需要传递这些标头才能使我的代码正常工作：

To opt in to a cross-origin isolated state, you need to send the following HTTP headers on the main document:


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

我将在哪里以及如何做这件事？全栈开发新手哈哈。

4

1 回答 1

0

我目前正在从事一个项目，在该项目中我在集成 ffmpeg-wasm 时也遇到了 SharedArrayBuffer 问题。

在部署的应用程序上播放来自 s3 的文件时，跨源资源策略问题的第一个片段解决了我的问题。这将进入您的 server.js（请注意，顺序很重要，在express.static之前设置标题）：

    app.use((req, res, next) => {
      res.header("Cross-Origin-Embedder-Policy", "require-corp");
      res.header("Cross-Origin-Opener-Policy", "same-origin");
      next();
    });
    
    app.use(express.static(...));

或者：

    const customHeaders = (res, path, stat) => {
      res.append("Cross-Origin-Embedder-Policy", "require-corp");
      res.append("Cross-Origin-Opener-Policy", "same-origin"); 
    }

    app.use(express.static(...), {
      setHeaders: customHeaders
    });

请注意，这种方法存在一些问题：

  • Safari 和其他一些浏览器不支持 SharedArrayBuffer，请参阅https://caniuse.com/sharedarraybuffer
  • 来自浏览器的所有跨域加载都将失败，例如外部脚本（例如 Analytics）或来自其他域的图像加载
于 2021-08-27T09:04:46.927 回答