标签: cross-origin-resource-policy

我有 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 …

我使用https://docs.aws.amazon.com/AmazonS3/latest/userguide/ManageCorsUsing.html在 s3 上设置 CORS 。在我的网站上，我使用ckeditor上传图像并将其发送到 s3。问题是，POST有效但GET无效。失败了

跨域资源策略

要从不同的源使用此资源，服务器需要在响应标头中指定跨源资源策略：

Cross-Origin-Resource-Policy: same-site 如果资源和文档由同一站点提供，请选择此选项。

Cross-Origin-Resource-Policy: cross-origin 仅当包含此资源的任意网站不会带来安全风险时才选择此选项。

来自 GET 的响应

Accept-Ranges: bytes
Content-Length: 90105
Content-Type: image/png
Date: Wed, 12 May 2021 16:44:33 GMT
ETag: "3524cdaa5d0975c249bb464033808244"
Last-Modified: Wed, 12 May 2021 16:44:33 GMT
Server: AmazonS3
...
x-amz-id-2: pNoskXKWXhpCbwArHgIN4kVD+oO8Pyq/3PIJAEcSJCo3hWMmHVspn2mIjfItCFAM+jUXtcN3pqY=
x-amz-request-id: 3BEE5J8RQPCXTQ93

我在 apache 服务器上设置了以下内容

Header set Content-Security-Policy "default-src 'self' *.s3.amazonaws.com *.uatdomainplus.com *.qadomainplus.com *.hci.com hci.com ; font-src *.typekit.net cdnjs.cloudflare.com fonts.gstatic.com *.hcidomain.plus *.uatdomainplus.com *.qadomainplus.com ; img-src 'self' data: *.s3.amazonaws.com; style-src …

（对于某些人来说，这个问题可能等于“如果我不能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">，我也尝试了，也没用。

我不是安全专家，很难弄清楚跨域资源策略和 CORS 之间的区别。我看到两者都依赖于服务器发送的标头，并且信任浏览器不允许将服务器内容传递给浏览器中的请求者（如果服务器这么说）。我哪里理解错了？

我在 Heroku 上部署了一个应用程序，可以让我播放音频文件。您可以在这里查看https://telecurve.herokuapp.com/manage。在我在 Heroku 中播放文件没有问题之前，但在修改了 server.js 文件之后（我的应用程序是一个 Express 应用程序，使用内置的 Create React 应用程序部署），我收到此错误。您可以尝试播放音频文件并查看响应。但是，我仍然可以使用下载按钮从 s3 下载文件，没有任何问题。

这是一些相关代码：

server.js

    require('rootpath')();
    const path = require('path');
    const express = require('express');
    const app = express();
    const bodyParser = require('body-parser');
    const cookieParser = require('cookie-parser');
    const cors = require('cors');
    
    app.use(bodyParser.urlencoded({ extended: false }));
    app.use(bodyParser.json());
    app.use(cookieParser());
    
    // Have Node serve the files for our built React app
    app.use(express.static(path.resolve(__dirname, 'build')));
    
    // allow cors requests from any origin and with credentials
    app.use(cors({ origin: (origin, callback) => callback(null, true), credentials: …