如何用 express/node.js 配置 CSP-headers？

Question

我尝试让标签在 express/node.js 环境中工作，但不知何故它们总是被内容安全策略阻止。

我已经尝试使用多个 node-modules，例如 express-csp-header 或 csp-header，但其中 none 成功了。所以我回到 'normal' 声明。

这是我的 server.ts 脚本的顶部：

app.use((req: any, res: any, next: any) => {
    res.set({
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept",
        "Access-Control-Allow-Methods": "GET, POST, PATCH, DELETE, OPTIONS",
        "Content-Security-Policy": "default-src *",
        "X-Content-Security-Policy": "default-src *",
        "X-WebKit-CSP": "default-src *"
    })
    next();
});

由 webpack 编译，节点运行在端口 3000 的本地主机上。

它不适用于 "default-src *" 或类似的。我什至尝试单独声明每种内容类型，例如

"default-src * 'self' 'unsafe-inline' 'unsafe-eval'; script-src * 'self' 'unsafe-inline' 'unsafe-eval' localhost:*/*"

这是 html 页面的 body 标签后的脚本部分：（将它放在头部部分也没有改变什么）

<script src="scripts/loginFunctions.js"></script>

也许重要的事情： HTML 输出由 squirrelly（express 的模板引擎）提供服务

app.get('/', (req: any, res: any) => {
    res.render('login');
})

用元标记在 head-section 中声明 header 也不起作用。我要引用的脚本的原始文件夹由 express 提供：

app.use(express.static('public'));

奇怪的是，这并没有发生在我的工作环境中，在那里一切都按预期工作。这是来自浏览器 (Firefox 66.0.5) 控制台的错误消息：

Loading failed for the <script> with source “http://localhost:3000/scripts/loginFunctions.js”.
Content Security Policy: The page's settings blocked the loading of a resource at http://localhost:3000/scripts/loginFunctions.js ("script-src").
Content Security Policy: The page's settings blocked the loading of a resource at inline ("script-src").

是的，我知道风险，但这将一直运行ning 在本地，即使有一天它会部署...我只希望一切运行ning 顺利（或根本运行）在开发过程中。任何有关如何解决此问题的帮助将不胜感激:)

Answer 1

好吧，我终于自己弄明白了。这是我的具体问题的答案，以防万一有人遇到同样的问题：

似乎插件 NoScript 在脚本应用后或在 HTML 文件的 <meta> 标记中添加了阻塞 header 条目。禁用它解决了问题:)

如何用 express/node.js 配置 CSP-headers？

How to configure CSP-headers with express/node.js?

javascript

http-headers

node.js

express

content-security-policy