Angular中的Content-Security-Policy标头

Question

在angular应用程序中，允许在Content-Security-Policy头中使用的值是什么？它抛给我一个类似这样的错误，我还在我的angular应用程序中添加了web.config文件。

在这里，我还附加了index.html文件。

​

​

​

​

Answer 1

从我的角度来看，我已经为上面的项目找到了两个解决方案。

1.这是web.config文件。

  <httpProtocol>
    <customHeaders>
    <remove name="X-Powered-By" />
    <add name="Referrer-Policy" value="no-referrer" />
    <add name="Permissions-Policy" value="camera=*,geolocation=*,microphone=*,autoplay=*,fullscreen=*,picture-in-picture=*,sync-xhr=*,encrypted-media=*,oversized-images=*" />
    <add name="Strict-Transport-Security" value="max-age=31536000; includeSubdomains" />
    <add name="X-Frame-Options" value="SAMEORIGIN" />
    <add name="X-Xss-Protection" value="1; mode=block" />
    <add name="X-Content-Type-Options" value="nosniff" />
    <add name="Content-Security-Policy" value="script-src https: 'unsafe-inline' 'unsafe-eval';
          style-src https: 'unsafe-inline' 'unsafe-eval';
          img-src https: data:;
          font-src https: data:;" />
  </customHeaders>
  </httpProtocol>

这里只有Content-Security-Policy标头

<add name="Content-Security-Policy" value="script-src 'self' 'unsafe-inline' 'unsafe-eval' https://stackpath.bootstrapcdn.com https://code.jquery.com https://cdnjs.com https://cdnjs.cloudflare.com; 
          style-src 'self' 'unsafe-inline' 'unsafe-eval' fonts.gstatic.com fonts.googleapis.com https://stackpath.bootstrapcdn.com https://use.fontawesome.com;
          object-src 'none';
          img-src 'self' data: blob:;
          font-src 'self' data: https://use.fontawesome.com fonts.gstatic.com fonts.googleapis.com ;"

对于每个API调用，如果需要添加以下标头，可以在http-interceptor文件中添加标头，如下所示。

 req = req.clone({
  setHeaders: {
    "Permissions-Policy": "camera=*,geolocation=*,microphone=*,autoplay=*,fullscreen=*,picture-in-picture=*,sync-xhr=*,encrypted-media=*,oversized-images=*",
    "Strict-Transport-Security": "max-age=31536000; includeSubdomains",
    "X-Frame-Options": "SAMEORIGIN",
    "X-Content-Type-Options": "nosniff",
    "X-Xss-Protection": "1; mode=block",
    "Content-Security-Policy": "script-src https: 'unsafe-inline' 'unsafe-eval';style-src https: 'unsafe-inline' 'unsafe-eval';img-src https: data:;font-src https: data:;"
  }
});