拒绝加载图像的https://res.cloudinary.com/.. 维奥安全策略指令：“img src‘自我’数据：”

Question

我使用vue.js和node.js，我上传照片在云端，当我上传网站上heroku它工作得很好，但给我一个错误的图像，我尝试了很多方法来解决，但它没有工作就是错误

Refused to load the image 'https://res.cloudinary.com/ammarleejot/image/upload/v1609954985/j7v7ezyvnax9fuokrryb.jpg' because it violates the following Content Security Policy directive: "img-src 'self' data:".

这就是我尝试使用的元标记

 <meta charset="utf-8">
    <meta http-equiv="Content-Security-Policy"
    content="default-src *  data: blob: filesystem: about: ws: wss: 'unsafe-inline' 'unsafe-eval' 'unsafe-dynamic'; script-src * data: blob: 'unsafe-inline' 'unsafe-eval'; connect-src * data: blob: 'unsafe-inline'; img-src * data: blob: 'unsafe-inline'; frame-src * data: blob: ; style-src * data: blob: 'unsafe-inline'; font-src * data: blob: 'unsafe-inline';">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">

默认src*“不安全内联”“不安全评估”；脚本src*“不安全内联”“不安全评估”；连接src*‘不安全内联’；img src*数据：blob:“不安全内联”；框架src*；样式src*‘不安全内联’；

and when i check my website on https://csper.io/evaluations/603cd4e5b55c2090fdd9fb4a
it show me that result 

default-src 'self'
base-uri 'self'
block-all-mixed-content
font-src 'self' data: https:
frame-ancestors 'self'
img-src 'self' data:
object-src 'none'
script-src 'self'
script-src-attr 'none'
style-src 'self' 'unsafe-inline' https:
upgrade-insecure-requests

Answer 1

我在评论中看到，你已经解决了通过设置ContentSecurity策略为假，这样你就禁用了CSP，我不认为这是你所寻找的...

如果您想访问该特定域，您应该将其添加到img src下的头盔指令中，如下所示

helmet.contentSecurityPolicy({
        directives: {
            "default-src":[ "'self'" ],
            "base-uri":[ "'self'" ],
            "font-src":[ "'self'", "https:", "data:" ],
            "frame-ancestors":[ "'self'" ],
            "img-src":[ "'self'", "data:", "http://res.cloudinary.com"], <--- HERE
            "script-src":[ "'self'" ],
            "script-src-attr":[ "'none'" ],
            "style-src":[ "'self'", "https:", "'unsafe-inline'" ],
        }
    });

在这里，您可以根据需要添加或删除。

这取决于您的应用程序，但通常最好启用CSP以防止大量攻击。

Answer 2

您已经在HTTP标头中发布了CSP，可能是通过头盔中间件发布的。
如果您希望使用

在两种内容安全策略同时出现的情况下，将适用更严格的策略。

BTW：

• '不安全动态'是不正确的令牌
• 'unsec-inline'令牌不支持连接-src/img-src/font-src指令。