头盔快递 ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200

Question

我需要帮助，我检查了所有 google 但没有得到真正的答案来打开我的问题。我想使用头盔来保护我的快速服务器。但是当我使用它时，我得到这个错误： ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200 for loaded my images from my database. 这是我的服务器快递：

// 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();
});

我正在从我的数据库中获取图像，所以本地主机中的 url 是：http://localhost:3000/image/

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

请帮忙

Answer 1

仔细研究 google 后，我从这里得到了解决方案： https://github.com/helmetjs/helmet/issues/176 我添加这一行：

res.setHeader('Cross-Origin-Resource-Policy', 'same-site');

只需刷新并清除缓存（在 MAC 上使用 cmd + R，在其他设备上使用 ctrl+R），效果非常好。谢谢Evan Hahn

Answer 2

tl;dr：禁用 the Cross-Origin-Embedder-Policy header，在 Helmet v5 中默认启用。

app.use(
  helmet({
    crossOriginEmbedderPolicy: false,
    // ...
  })
);

这里是头盔维护员。

头盔将 the Cross-Origin-Embedder-Policy HTTP response header 设置为 require-corp。

设置此 header 意味着加载 cross-origin 资源（如来自其他资源的图像）更加棘手。例如，像这样加载 cross-origin...

<img alt="My picture" src="https://example.com/image.png">

...除非 example.com 明确允许，通过设置它自己的一些响应 header，否则将无法工作。您的浏览器将尝试加载 example.com/image.png，如果未明确允许，您的浏览器将放弃响应。

要解决此问题，您可以防止头盔设置 Cross-Origin-Embedder-Policy header，如下所示：

app.use(
  helmet({
    crossOriginEmbedderPolicy: false,
    // ...
  })
);

我做了 a small sample app 你可以用来玩这个。在我的测试中，它似乎在 HTTP 中不起作用，但它 在 HTTPS 上 起作用，这可能解释了为什么事情只会在生产中中断。

Answer 3

在我的例子中，我就是这样使用的

    helmet({
      crossOriginResourcePolicy: false,
    })

问题出在 cross-origin 资源策略上，应该是 same-site，因为浏览器将其视为另一个来源。

Answer 4

如果版本控制对您来说是更好的选择，我在头盔上遇到了同样的问题 >=5.0.0。下降到 4.6.0 解决了这个错误。

Answer 5

我遇到了同样的问题，已解决：

helmet({
    crossOriginResourcePolicy: false,
})

头盔快递 ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200

Helmet Express ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200

express

cors

helmet.js

cross-origin-embedder-policy

cross-origin-resource-policy