内容安全策略和 Office UI Fabric答案

【问题标题】：Content Security Policy and Office UI Fabric内容安全策略和 Office UI Fabric
【发布时间】：2019-04-09 19:27:46
【问题描述】：

我一直在尝试设置 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 出现问题 - 它通过 merge-styles 和 @microsoft/load-themed-styles 将 7 或 8 种样式注入页面。

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

是否遗漏了一个非常明显的设置和文档？

谢谢

克里斯

【问题讨论】：

【解决方案1】：

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

window.FabricConfig = { 

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

或

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

【讨论】：