标签: cross-origin-opener-policy
Cross-Origin-Opener-Policy 策略会阻止使用 Google 登录时出现 window.postMessage 调用错误
我已经使用弹出 UX 模式为 Firebase 上托管的 React 网站实现了“使用 Google 登录”。我可以登录，但是，每次登录 localhost:3000 或网站的部署版本时，都会收到以下错误：
Cross-Origin-Opener-Policy policy would block the window.postMessage call.
我已尝试按照此处详细说明设置跨源开启器策略。在设置过程中，我的 firebase.json 文件如下所示：
{
"database": {
"rules": "database.rules.json"
},
"functions": {
"predeploy": ["npm --prefix \"$RESOURCE_DIR\" run lint"],
"source": "functions"
},
"hosting": [
{
"target": "sandbox",
"public": "build",
"ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
"rewrites": [
{
"source": "**",
"destination": "/index.html",
"headers": [
{
"key": "Cross-Origin-Opener-Policy",
"value": "same-origin-allow-popups"
}
]
}
],
"headers": [
{
"source": "**",
"headers": [
{
"key": "Cross-Origin-Opener-Policy",
"value": …firebase reactjs cross-origin-opener-policy sign-in-with-google
推荐指数
解决办法
查看次数
有没有办法在 GitHub Pages 上使用 SharedArrayBuffer？
要使用SharedArrayBuffer，我们必须添加两个响应标头：
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
有什么方法可以使用 GitHub Pages 添加这些标头吗SharedArrayBuffer？
github-pages webassembly sharedarraybuffer cross-origin-embedder-policy cross-origin-opener-policy
推荐指数
解决办法
查看次数
跨源 Opener 策略标头已被忽略 - DJANGO
我正在 Django 中制作一个 Chatapp 项目。我实现了通道和 websockets 来发送和接收消息，当我在同一浏览器中使用两个不同的窗口（其中一个处于隐身模式）进行测试时，这是有效的，但是当我尝试使用另一个浏览器测试它时，我收到以下错误：
我尝试使用以下配置解决实现 django corsheaders 的问题：
（我知道将所有起源设置为 true 并不推荐，但这只是为了测试目的）
推荐指数
解决办法
查看次数
Firebase Auth 处于跨源隔离模式？
我正在开发一个 Web 应用程序，该应用程序使用 Emscripten 的多线程 WASM 运行计算密集型代码，因此需要 SharedArrayBuffers。仅当我的应用程序处于跨源隔离模式时，这些才有效。为了实现这一点，我必须在我的应用程序上设置以下标头：
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
现在，我想在我的项目中使用 Firebase - 第一步是集成 Firebase 的 Auth。现在，我正在使用它firebaseui来处理登录流程。不幸的是，这不起作用，当我在浏览器中启动登录流程时，我可以在 DevTools 中看到以下消息：
除了网络选项卡中的错误之外，我没有收到任何表明发生错误的指示（即没有未捕获的异常）。如果没有 COOP/COEP 标头，一切都会正常工作。
有没有办法可以在跨源隔离模式下使用 Firebase 的身份验证？
firebase cross-origin-embedder-policy cross-origin-opener-policy cross-origin-resource-policy
推荐指数
解决办法
查看次数
可以使用元标记（http-equiv）设置 COOP/COEP 标头吗？
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 中）。所以看来我无法使用元标记设置这些标头？
html http-headers cross-origin-embedder-policy cross-origin-opener-policy
推荐指数
解决办法
查看次数
是否可以在普通页面中嵌入跨域隔离的 iframe？
（对于某些人来说，这个问题可能等于“如果我不能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">，我也尝试了，也没用。
webassembly sharedarraybuffer cross-origin-embedder-policy cross-origin-opener-policy cross-origin-resource-policy
推荐指数
解决办法
查看次数
反应错误：Firefox 中的“SharedArrayBuffer 未定义”
我有一个 React 应用程序，它是用“create-react-app”创建的（我也使用 jsdom NPM 包），出于某种原因，该应用程序仅在 Firefox 中在加载时引发错误（在 Chrome 和 Edge 中工作正常）。
这是错误：
ReferenceError: SharedArrayBuffer is not defined
./node_modules/jsdom/node_modules/webidl-conversions/lib/index.js
C:/Or/Web/WorldCovid/WorldCovid/node_modules/jsdom/node_modules/webidl-conversions/lib/index.js:347
344 |
345 | const abByteLengthGetter =
346 | Object.getOwnPropertyDescriptor(ArrayBuffer.prototype, "byteLength").get;
> 347 | const sabByteLengthGetter =
348 | Object.getOwnPropertyDescriptor(SharedArrayBuffer.prototype, "byteLength").get;
349 |
350 | function isNonSharedArrayBuffer(V) {
经过一番谷歌搜索，我发现：
“为了使SharedArrayBuffer在Firefox中，去about：config中和javascript.options.shared_memory偏好设置为true”（https://github.com/ggerganov/kbd-audio/issues/9）
的问题是它已经启用为true。
以前有人遇到过这个问题吗？谢谢。
更新：
尝试转换为：
const shared = new SharedArrayBuffer(1024);
const abByteLengthGetter =
Object.getOwnPropertyDescriptor(ArrayBuffer.prototype, "byteLength").get;
const sabByteLengthGetter =
Object.getOwnPropertyDescriptor(shared.prototype, "byteLength").get;
仍然得到相同的错误（与 SharedArrayBuffer 对象不同的行）。
javascript firefox reactjs cross-origin-embedder-policy cross-origin-opener-policy
推荐指数
解决办法
查看次数
https://example.com/ 上 SharedArrayBuffers 的新要求
今天收到一封来自谷歌的邮件：
https://example.com/ 上SharedArrayBuffers 的新要求
Google 系统最近检测到https://example.com/上使用了SharedArrayBuffers (SAB) ，但未提供COOP和/或COEP标头。
出于 Web 兼容性原因，Chrome 计划要求 COOP/COEP 从 Chrome 91 (2021-25-05) 开始使用 SAB。请在您的网站上实施“跨源隔离”行为。
今天下午我一直在阅读这个，但我完全迷失了！
我在我的网站上经常使用以下内容：
- 来自 Freestar.io 的广告
- 托管在 AWS 存储桶中的静态内容（JS、CSS 和一些图像）
- iframe 中来自 Youtube 和 Vimeo 的内容
- 来自各种 CDN 的 Bootstrap CSS 和 JS 以及 jQuery
我已经检查了 CDN 的标头，如果我在我的网站上设置了这些标头，可以看到cross-origin-resource-policy设置为cross-origin：
Cross-Origin-Embedder-Policy = require-corp
Cross-Origin-Opener-Policy = same-origin
然后cross-origin-resource-policy: cross-origin可以显示来自 CDN 的内容，其中提供的内容的标题包含标题，只要我包含该crossorigin选项，例如这里：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css" crossorigin>
但是，我查看了其他各种网站，但它们没有这些标题。这些网站包括：
- 自动售货机
- Freestar.io 广告 …
security amazon-web-services cors cross-origin-embedder-policy cross-origin-opener-policy
推荐指数
解决办法
查看次数
标签 统计
cross-origin-embedder-policy ×6
cross-origin-resource-policy ×2
firebase ×2
reactjs ×2
webassembly ×2
cors ×1
django ×1
firefox ×1
github-pages ×1
html ×1
http-headers ×1
javascript ×1
security ×1