头盔快递ERR_BLOCKED_BY_RESPONSE.NotSameOrigin 200

Question

请帮助我，我检查了所有的谷歌，并没有得到真正的答案打开我的问题。我想用头盔来保护我的快递服务器。但是当我使用它时，我得到了一个错误: 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();
});

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

当我不戴头盔的时候，一切都很好。

请你帮忙

Answer 1

tl;dr:禁用 标题，默认情况下在头盔v5.中启用

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

头盔维修工在这里。

头盔将HTTP响应标头设置为require-corp。

设置这个标题意味着加载跨源资源(就像来自另一个资源的图像)要复杂得多。例如，像这样装载一个跨原点.

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

.除非example.com显式地允许它，否则不会工作，方法是设置它自己的一些响应头。您的浏览器将尝试加载example.com/image.png，如果不显式允许，浏览器将删除响应。

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

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

我制作了一个小示例应用程序，你可以用来玩这个。在我的测试中，它似乎不能在HTTP中工作，但是它可以在HTTPS上工作，这可能解释了为什么在生产中事情只会中断。

Answer 2

我也有同样的问题，这个问题解决了：

helmet({
    crossOriginResourcePolicy: false,
})

Answer 3

如果版本控制对你来说是一个更好的选择，我在头盔>=5.0.0上也有同样的问题。跳转到4.6.0解决了这个错误。