Question

我一直在尝试设置CSP以与Office UI Fabric React一起使用。有没有比style-src 'unsafe-inline'更安全的东西了？

我们有一个带有TypeScript的Create React App，我们正在使用Office UI Fabric React提供一致的外观。

使用csp-html-webpack-plugin和craco，在设置INLINE_RUNTIME_CHUNK=false时，可以为我们自己的代码的样式和脚本生成带有哈希值的CSP。

Office UI Fabric React出现问题-通过合并样式和@ microsoft / load-themed-styles将7或8种样式注入页面。

我找不到任何其他人在谈论使用Office UI Fabric React设置CSP的引用，更不用说任何潜在的解决方案了。

错过了一个非常明显的设置和文档吗？

谢谢

克里斯

Answer 1

感谢您将此问题引起我们的注意。我们在@ uifabric / merge-styles v6.17.0中添加了对“ nonce”的支持。随机数在FabricConfig对象上指定：

window.FabricConfig = { 

        mergeStyles: {
            cspSettings: { nonce: 'mynonce'}
        }
    }

或

Stylesheet.getInstance().setConfig({
 cspSettings: {
 nonce: "abc"
 }
});