CSP中来自“未定义”源的脚本是什么意思？

Question

我最近已从stripe.js v2移至stripe.js v3 /元素。在此过程中，我收到了新的CSP错误。这些似乎不会导致条带失败，但是我想了解它们：

Content Security Policy: The page's settings blocked the loading of a resource at self ("script-src"). Source: ;undefined.
elements-inner-card-15fb9df8718486f330c3990dde96bfd7.html:1

Content Security Policy: The page's settings blocked the loading of a resource at self ("script-src"). Source: ;undefined.
controller-3984d4085075df939703ec0d22159407.html:1

这两个elements-inner-card-15fb9df8718486f330c3990dde96bfd7.html和controller-3984d4085075df939703ec0d22159407.html来自条纹。我不明白的是script-src的undefined？

• 一个怎么能script-src是undefined？一个<script>元素通常有一个src，如果不是unsafe-inline。什么undefined意思

• 如何修改我的CSP以允许Stripe v3？

编辑：使用LastPass时，该错误似乎仅在Firefox上出现。Chrome不会显示此错误，禁用附加组件的Firefox也不会显示此错误。

Answer 1

对于像我一样最终来到这里的人来说，解决方案与“禁用插件”不同。

上下文：我在 React 中使用 stripe，并使用react-stripe-elements来做到这一点。当我这样做时，出现了 CSP 错误：

<form>
    {loading ? <Spinner /> : <CardElement /> }
</form>

看来动态安装/卸载在那里不太顺利。我这样改了：

<form>
    <div className={classnames({hidden: !loading})}><Spinner /></div>
    <div className={classnames({hidden: loading})}><CardElement /></div>
</form>

当然，使用相应的 CSS 后hidden，错误就消失了。

希望它能帮助一些迷失的灵魂:)