标签: cross-origin-embedder-policy

要使用SharedArrayBuffer，我们必须添加两个响应标头：

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

有什么方法可以使用 GitHub Pages 添加这些标头吗SharedArrayBuffer？

请帮助解决这个问题。我正在使用 MERN 应用程序。在应用程序中，我使用 API 将图像上传到 cloudnary。然后我使用 secure_url 将图像上传到前端。它可以在 localhost 上运行，但不能在 heroku 上运行，即图像未上传

本地主机：

赫罗库：

浏览器控制台响应：

其他图片：

上传.js

const express = require("express");
const router = express.Router();
const cloudinary = require("cloudinary");
const { verifyTokenTeacher } = require("./verifyToken");

cloudinary.config({
  cloud_name: process.env.CLOUD_NAME,
  api_key: process.env.CLOUD_API_KEY,
  api_secret: process.env.CLOUD_API_SECRET,
});

// upload image
router.post("/upload", verifyTokenTeacher, (req, res) => {
  try {
    console.log(req.files);
    if (!req.files || Object.keys(req.files).length === 0)
      return res.status(400).json({ msg: "Fayl yuklanmangan" });

    const file = req.files.file; // oxiridagi file bu query parametr
    if (file.size > …

我有 2 个域，一个托管我的应用程序 - myapp，另一个托管 gooddata 仪表板 - analytics.myapp。我想将gooddata仪表板嵌入到我的应用程序的页面中。我已将frame-src设置为允许来自仪表板所在域的请求：

set $CSP "${CSP}; frame-src https://analytics.myapp.com/";

add_header Content-Security-Policy ${CSP};

我还在CORS主机上设置了analytics.myapp允许来自myapp域的请求：

ingress:
    nginx.ingress.kubernetes.io/enable-cors: "true"
    nginx.ingress.kubernetes.io/cors-allow-origin: "http://localhost:10000, https://myapp.com"

我想将包含来自域的内容的 iframe 嵌入到域的analytics.myapp页面中，只有在您通过身份验证后才能看到该内容myapp。现在，当我加载内容时，iframe 正在显示登录页面，如果我尝试通过 iframe 登录，则会收到错误消息：

Blocked autofocusing on a <input> element in a cross-origin subframe.

如果我使用不同选项卡中的用户登录，analytics.myapp则无法正常工作，因为 cookie 不会发送到域myapp。我发现可以通过他们的文档中的 api 进行身份验证。他们还有关于如何嵌入仪表板的文档，但为了查看嵌入式仪表板文档说：

用户必须是工作区成员才能查看嵌入式仪表板。

我还没有实现 SSO（单点登录），但我想知道一旦实现它，CORS 还会有问题吗？我可以想象，一旦我实现了这个，来自myapp域的用户进入一个页面，其中我有一个带有嵌入式仪表板的 iframe analytics.myapp，他们将被重定向到一个身份验证端点，在该端点上myapp用户将通过 SSO 进行身份验证 …

我正在开发一个 Web 应用程序，该应用程序使用 Emscripten 的多线程 WASM 运行计算密集型代码，因此需要 SharedArrayBuffers。仅当我的应用程序处于跨源隔离模式时，这些才有效。为了实现这一点，我必须在我的应用程序上设置以下标头：

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

现在，我想在我的项目中使用 Firebase - 第一步是集成 Firebase 的 Auth。现在，我正在使用它firebaseui来处理登录流程。不幸的是，这不起作用，当我在浏览器中启动登录流程时，我可以在 DevTools 中看到以下消息：

除了网络选项卡中的错误之外，我没有收到任何表明发生错误的指示（即没有未捕获的异常）。如果没有 COOP/COEP 标头，一切都会正常工作。

有没有办法可以在跨源隔离模式下使用 Firebase 的身份验证？

请我需要帮助，我检查了所有谷歌，但没有得到打开我的问题的真正答案。我想使用头盔来保护我的 Express 服务器。但是当我使用它时，我收到此错误：ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200 从数据库加载图像。这是我的服务器快递：

// Initialize server
const app = express()
app.use(express.urlencoded({ extended: true }));
app.use(express.json());
app.use(cookieParser());
app.use(cors())
app.use(helmet())

// CORS configuration
app.use(function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

我从数据库中获取图像，因此 localhost 中的 url 为：http://localhost:3000/image/<name_image>

当我不使用头盔时一切正常。

请任何帮助

我正在尝试使网站跨源隔离，并在我的网站上启用以下标头：

https://web.dev/cross-origin-isolation-guide/

Cross-Origin-Opener-Policy: same-origin\nCross-Origin-Embedder-Policy: require-corp\n

Firebase 身份验证使用以下调用：

https://<AUTH_DOMAIN>/__/auth/iframe?apiKey=<API_KEY>&appName=[默认]

如果您导致身份验证失败，则会被阻止。

\n

由于您的站点启用了跨源嵌入器策略 (COEP)，因此每个资源都必须指定合适的跨源资源策略 (CORP)。此行为会阻止文档加载未\xe2\x80\x99s 显式授予加载权限的跨源资源。\n要解决此问题，请将以下内容添加到资源\xe2\x80\x99s 响应标头中:\n跨源-Resource-Policy：如果资源和您的网站是从同一网站提供的，则为同一站点。\nCross-Origin-Resource-Policy：如果资源是从您网站以外的其他位置提供的，则为跨源。\xe2\x9a\xa0\xef\xb8\x8f如果设置此标头，任何网站都可以嵌入此资源。

\n

如何解决这个问题？看来根本问题是 firebase 需要在他们这边设置一个标头？

我正在尝试访问我的电影 API，该 API 通过 React 应用程序返回包括电影海报图像的数据。该图像是从外部网站请求的。每次我向端点发出请求时\\movies，图像都会被阻止，并且我会在控制台中收到以下消息

net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200

在“网络”选项卡中查看请求时，我收到以下消息，表示启用跨源资源策略

Because your site has the Cross-Origin Embedder Policy (COEP) enabled, each resource must specify a suitable Cross-Origin Resource Policy (CORP). This behavior prevents a document from loading cross-origin resources which don\xe2\x80\x99t explicitly grant permission to be loaded.\nTo solve this, add the following to the resource\xe2\x80\x99s response header:\nCross-Origin-Resource-Policy: same-site if the resource and your site are served from the same site.\nCross-Origin-Resource-Policy: cross-origin if the resource is served …

使用 Helmet.js 时，我在浏览器控制台中看到以下错误：

 net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep

我应该怎么办？

Cross-Origin-Embedder-Policy和Cross-Origin-Opener-Policyheaders 可以用标签设置吗<meta>？还是只能用实际的 headers 设置？如果没有，是否有可以使用元标记设置的标头列表？

以下示例记录crossOriginIsolated: false到控制台。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Cross-Origin-Embedder-Policy" content="require-corp">
  <meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>COOP/COEP header test</title>
</head>
<body>
  <script>console.log("crossOriginIsolated:", self.crossOriginIsolated)</script>
</body>
</html>

如果我删除这些http-equiv元标记并使用实际的 HTTP 标头提供文件，那么它会记录crossOriginIsolated: true（在 Chrome 和 Firefox 中）。所以看来我无法使用元标记设置这些标头？

（对于某些人来说，这个问题可能等于“如果我不能sharedArrayBuffer在我的主站点中使用，我可以打开一个 iframe 并sharedArrayBuffer在 iframe 内部使用吗？”）

所以我想在我的站点中使用一些带有sharedArrayBuffer的wasm，但是使站点跨域隔离是不切实际的，所以我创建了另一个站点https://my-wasm-function.app，它是跨域隔离的。我希望将它用作 iframe，并通过 与我的主站点进行通信postMessage。

然而，我发现一旦它作为 iframe 嵌入，它就失去了隔离状态。

2021 年 3 月曾有人提出过类似的问题，当时接受的答案是“否”。然而，最近的一篇谷歌博客文章似乎暗示不然，所以我想再问一遍。

该博文有一些关于如何隔离 iframe 的模糊说明，其中之一是添加标题Cross-Origin-Resource-Policy: cross-origin（我认为在COOP和 的顶部COEP），我尝试过，但没有成功。还有一个就是这样打开iframe：<iframe allow="cross-origin-isolated">，我也尝试了，也没用。