我的 NextJS 应用程序被客户的渗透测试软件扫描并指出不应使用“unsafe-inline”。但是，当页面上使用 MUI 组件时，我无法使随机数正常工作并出现以下错误。
Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'nonce-MDkzMjY2YmMtYTA2My00YzczLTljNTYtNjYyY2ZiODgyNjE0'". Either the 'unsafe-inline' keyword, a hash ('sha256-7uP4UMn0lzlm+J1RYqmY7+9oGVF+O/z16924/Q7zptE='), or a nonce ('nonce-...') is required to enable inline execution. Note that hashes do not apply to event handlers, style attributes and javascript: navigations unless the 'unsafe-hashes' keyword is present.我尝试过的事情：
Here 在 GitHub 上我上传了一个显示问题的测试项目。它只是一个使用 App Router 的 NextJS 入门项目。添加了用于随机数生成的中间件以及 MUI CacheProvider。唯一的页面只是默认的起始页面，全部已清理完毕，只有一个来自 MUI 的 CircularProgress UI。
我还需要添加或设置什么才能使 MUI 不再产生这些错误？ 我已经被这个问题困扰了一个多星期了，我正在拔掉头发。请帮忙！
首先，您需要确定样式的“不安全内联”是否确实是一个问题。 tl;dr：如果您的 CSP 的其余部分是严格的，那么 CSS 攻击不会造成太大的不良后果。
您说您已经尝试过随机数，并提到它们与 cookie 和缓存有关。 Nonce在cookie中没有任何功能，如果客户端上有nonce值，则可以被攻击者使用。它们需要像这样的风格标签
<style nonce='<nonce value>'>... css code goes here ...</style>
如果您尝试在样式属性中使用它们，这些不是 nonceable 元素，并且它将不起作用。请记住，只有在您还设置了“不安全哈希”的情况下，哈希才有效
如果某些代码插入了样式元素，则还需要添加随机数。这会变得复杂，特别是如果由第三方代码处理的话。
您应该识别所有有问题的代码，并查看是否可以重写其中的任何代码。随机数很难。哈希更容易一些，但只有在输出的样式是静态的并且仅限于合理数量的变体/哈希时才有效。