启用 nuxt security 跨域嵌入器策略的 qualtrics

Question

尝试在我们的 nuxt 应用程序中嵌入外部脚本。 （Nuxt3）。

我们有以下安全设置：

nuxt.config 摘录：

security: {
    headers: {
      crossOriginEmbedderPolicy: 'credentialless', // added this specifically for qualtrics
      contentSecurityPolicy: {
        'connect-src': '*',
        'base-uri': 'self',
        'default-src': 'self',
        'font-src': [
          "'self'",
          'data:',
        ],
        'form-action': [
          "'self'",
          // added this specifically for qualtrics:
          'https://[our company].qualtrics.com',
        ],
        'img-src': [
          "'self'",
          'https:',
          'data:',
        ],
        'object-src': 'none',
        'script-src-attr': 'none',
        'style-src': [
          "'self'",
          'https:',
          "'unsafe-inline'",
        ],
        'script-src': [
          "'self'",
          'https:',
          "'unsafe-inline'",
          "'strict-dynamic'",
          "'nonce-{{nonce}}'",
        ],
        // added this specifically for qualtrics:
        'frame-src': [
          "'self'",
          'https://[our company].qualtrics.com',
        ],
        'frame-ancestors': 'self',
        'upgrade-insecure-requests': true,
      },
      xContentTypeOptions: 'nosniff',
    },
  },

这样，我可以显示调查弹出窗口，但它没有任何内容，请参阅屏幕截图：

将鼠标悬停时，我可以看到警告：

[our company].qualtrics.com refused to connect

有没有办法从 qualtrics 接口发送 CORS 详细信息？这将是我解决此问题的首选方法，但我在质量文档中没有找到任何有用的东西。

或者，我需要如何编辑安全策略才能查看内容？

阅读完这个问题后，我尝试将 qualtrics url 添加到 script-src 并用它替换

none-{{nonce}}

行，但无济于事。

Answer 1

找到了更多文档，并相应更新了安全性：

nuxt.config

security: {
  headers: {
    crossOriginEmbedderPolicy: 'unsafe-none', // also works when set to false
    contentSecurityPolicy: {
        'connect-src': '*',
        'base-uri': 'self',
        'default-src': 'self',
        'font-src': [
          "'self'",
          'data:',
        ],
        'form-action': [
          'https://*.qualtrics.com', // needed
          "'self'",
        ],
        'frame-ancestors': 'self',
        'img-src': [
          "'self'",
          'https:',
          'data:',
          'https://*.qualtrics.com', // needed
        ],
        'object-src': 'none',
        'script-src-attr': 'none',
        'style-src': [
          "'self'",
          'https:',
          "'unsafe-inline'",
        ],
        'script-src': [
          "'self'",
          'https:',
          "'unsafe-inline'",
          "'strict-dynamic'",
          "'nonce-{{nonce}}'",
          'https://*.qualtrics.com', // needed
        ],
        'frame-src': 'https://*.qualtrics.com', // needed
        'upgrade-insecure-requests': true,
      },
  },
}

文档还指出允许

eval-unsafe

但在我的情况下这不是必需的。