内容安全策略和 Office UI Fabric

Question

我一直在尝试设置一个 CSP 来与 Office UI Fabric React 一起工作。有没有可能得到比 style-src 'unsafe-inline' 更安全的东西？

我们有一个使用 TypeScript 的 Create React 应用程序，我们正在使用 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' 的支持。 nonce 在 FabricConfig 对象上指定：

window.FabricConfig = { 

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

或

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

Content Security Policy and Office UI Fabric