预检响应中的 Access-Control-Allow-Headers 不允许请求 header 字段 sentry-trace

Request header field sentry-trace is not allowed by Access-Control-Allow-Headers in preflight response

我正在为 auth-purpose 使用 NextJS 和 Keycloak 开发前端。添加哨兵后,我在这里面临这个问题,Keycloak 的 token 端点返回错误;这样我就可以登录了。

我试过很多东西:

现在我没有更多的想法,所以我来这里寻求更多帮助。

不幸的是,Keycloak 有 hardcoded list of allowed headers,因此您无法为 sentry-trace header.

配置 Keycloak

您可以有一些不理想的解决方法:

  • 不要使用哨兵
  • 编译自己的破解版 Keycloak 版本,您允许 header
  • 在Keycloak前面添加反向代理,会添加sentry-trace header到allowed headers
  • ...

所以经过一些调查,我发现了这个 tracingOrigins 属性 可以使用这样的集成来设置:

integrations: [
    new (Sentry.Integrations as any).BrowserTracing({
        tracingOrigins: [
            process.env.NEXT_PUBLIC_URL,
            process.env.NEXT_PUBLIC_BACKEND_URL,
            process.env.NEXT_PUBLIC_MATOMO_URL,
        ],
    }),
],

此配置在 sentry.client.config.ts 文件中完成。缺点是,不包含在那里的 url 根本不会被跟踪。