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

Question

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

我试过很多东西：

更改 Keycloak 的 web-origin 配置，（显然）不会更改或解决问题
尝试使用 Sentry 客户端配置，但没有成功，因为 denyUrls 属性仍然使 Sentry SDK 将 sentry-trace 发送到请求中。

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

Answer 1

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

配置 Keycloak

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

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

Answer 2

所以经过一些调查，我发现了这个 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 根本不会被跟踪。

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

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

sentry

keycloak

next.js