带有 React 内联块的安全 CSP

问题描述

我希望对我的 React 前端进行尽可能安全的设置。目前，我在部署中从 server.js 文件夹中运行 /build，因此它处于已编译的生产状态。

但是，如果 js 是捆绑和内联的，我不能使用以下 CSP，这是相当严格的：

<meta http-equiv="Content-Security-Policy" content=
  "default-src 'none'; 
   object-src 'self'; 
   script-src 'self'; 
   worker-src 'self'; 
   connect-src 'self'; 
   img-src 'self' data:; 
   style-src 'self'; 
   font-src 'self'; 
   manifest-src 'self';">

我也有

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'".

因为像 Draggable 这样的一些 node_modules 似乎动态内联样式。

对我来说，有什么方法可以使我的代码保持相当模糊以阻止攻击者以及强大的 CSP？我听说 webpack 插件可能会有所帮助，但我真的不明白它在构建管道中是如何工作的。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）