角度6:内容安全策略:页面设置阻止了在self上加载资源(“script-src”)

Question

我在做一个六角形项目。当我运行命令时，我的代码工作正常

吴--服务

而且当我用

吴建

并将其部署到本地Tomcat服务器上。我没有错误，工作很好。

但是，当我在我的Ubuntu机器上将其部署到Apache服务器上时，我将分别在Firefox和Chrome上遇到以下错误

Content Security Policy: The page’s settings blocked the loading of a resource at self (“script-src”). Source: onfocusin attribute on DIV element.

Error: call to Function() blocked by CSP
compiler.js:22402

Content Security Policy: The page’s settings blocked the loading of a resource at self (“script-src”). Source: call to eval() or related function blocked by CSP.

我已经引用了许多链接，并尝试了多个选项，但仍然没有成功地解决它。任何帮助都将不胜感激。

提前谢谢。

Answer 1

在向IIS服务器部署持续的Range6开发时，也面临着同样的问题(而应用程序在本地开发环境中工作得很好)。

经过一些研究，Webpack的产出似乎不能很好地处理严格的内容--安全政策，所以你必须减少它。

这可以通过添加一些带有放松的CSP定义的自定义头来实现。

在我的例子中(IIS/ASP.NET).

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <add name="Content-Security-Policy" value="default-src 'self' ; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'" />
        </customHeaders>
    </httpProtocol>
</system.webServer>

找到一些如何在Apache中添加自定义这里的示例。

更新:作为附加信息，请参阅此角cli问题。克莱丁在3月19日提到..。

不安全--如果使用生产构建，则不再需要(将反射填充删除，因为它们只用于JIT)。 不安全--样式仍然需要内联。如果这不能满足项目的需求，则另一个选项是只在应用程序中使用全局样式，而不使用任何包含组件样式的角库。请注意，在这种情况下，项目将失去基于组件的体系结构的全部好处。

因此，如果使用AOT，可能可以修改CSP定义。