Expess应用程序中img src的Stripe内容安全策略错误

Question

输入卡详细信息并继续付款后，条纹中会弹出一个小空白，我在控制台中收到一个错误。

Refused to load the image 'https://hooks.stripe.com/img/favicon.png' because it violates the following Content Security Policy directive: "img-src data: https://q.stripe.com".

这是错误的屏幕截图错误

我还按照条带设置了内容安全策略，但仍然一次又一次地出现相同的错误。

app.post('/payments/create', async (request, response) => {
response.set("Content-Security-Policy", `script-src 'self' https://js.stripe.com https://checkout.stripe.com; style-src 'self' checkout.stripe.com; frame-src 'self' *.stripe.com *.stripe.network; img-src data: 'self' https://*.stripe.com; connect-src 'self' *.stripe.com;`);
const total = request.query.total;
const paymentIntent = await stripe.paymentIntents.create({
amount: total, //subunits of the currency
currency: "usd",
});
response.status(201).send({
clientSecret: paymentIntent.client_secret,
}); // OK and Created something
})

Answer 1

错误表明您的img src指令是"img src数据：https://q.stripe.com"而你的政策定义是"；img src数据："self"https://*.stripe.com&"；。您应该检查是否在响应标头或元标记中定义了多个CSP。内容将需要通过所有策略，在这种情况下，可能有另一个策略导致它崩溃。你可能已经尝试以另一种方式实现CSP，但忘记删除它。