使用头盔时无法在我的网站上附加 google 表格

Question

我无法在使用 helmet js 时将 google 表单附加到我的网站。允许它的代码是什么？

iframe

<iframe src="https://docs.google.com/forms/d/e/..." width="600" height="850px" class="col-12" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe>

头盔中间件

app.use(helmet({
    contentSecurityPolicy: {
        directives: {
            frameSrc: ["'self'", "https://docs.google.com/forms"],
        }
    },
}));

客户端错误

Refused to frame 'https://docs.google.com/forms' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

Answer 1

终于找到解决方法了

如果我们想在网站中嵌入任何 link，我们需要设置 COEP (Cross-Origin-Embedder-Policy) 响应 header。

app.use(helmet({
    contentSecurityPolicy: {
        directives: {
            "frame-ancestors": ["'self'", "*.google.com/"],
            frameSrc: ["'self'", "*.google.com/"],
            childSrc: ["'self'", "*.google.com/"]
        }
    },
    // crossOriginEmbedderPolicy: false
}));

app.use((req, res, next) => {
    res.header("Cross-Origin-Embedder-Policy", "cross-origin")
    next()
})

使用头盔时无法在我的网站上附加 google 表格

Not able to attach google form in my website when using helmet

forms

node.js

express

content-security-policy

helmet.js