Docker环境下Keycloak配置正确仍出现CORS错误求助

环境配置 #

• Keycloak版本：26.0.7（Docker部署）
• 前端：React应用，地址 http://localhost:3000
• 后端：Spring Gateway，地址 http://localhost:8080
• Docker Compose Keycloak配置：

saip-keycloak:
  image: quay.io/keycloak/keycloak:26.0.7
  container_name: saip-keycloak
  ports:
    - "8090:8080"
  volumes:
    - ./keycloak/dev/seed/realm-import.json:/opt/keycloak/data/import/realm-import.json
    - ./keycloak/dev/custom-theme:/opt/keycloak/themes/custom-theme
  environment:
    - KC_DB=mariadb
    - KC_DB_URL=jdbc:mariadb://saip-mariadb-auth:3306/saip_auth_db
    - KC_DB_USERNAME=auth_user1
    - KC_DB_PASSWORD=auth_user1
    - KC_BOOTSTRAP_ADMIN_USERNAME=admin
    - KC_BOOTSTRAP_ADMIN_PASSWORD=admin
    - JAVA_OPTS_APPEND=-Dkeycloak.logging.level=DEBUG
    - KC_SPI_HOSTNAME_DEFAULT_FORWARDED=true
  command: [
    "start-dev",
    "--import-realm",
    "--log-level=DEBUG",
    "--hostname=localhost"
  ]

Keycloak配置 #

1. Web Origins：
   • http://localhost:3000
   • http://localhost:8080
2. Valid Redirect URIs：
   • http://localhost:3000/*
   • http://localhost:8080/*
3. Valid Post Logout Redirect URIs：
   • http://localhost:3000

问题描述 #

用户访问前端http://localhost:3000并尝试通过Keycloak认证时，流程如下：

1. 前端向后端发送请求http://localhost:8080/success-page。
2. 若未认证，后端将用户重定向至Keycloak登录页http://localhost:8090。
3. 浏览器访问Keycloak登录页或其静态资源（如CSS、JS）时触发CORS错误。

已验证信息：

• 缺少CORS响应头：浏览器网络面板显示Keycloak响应中没有Access-Control-Allow-Origin头。
• 预检请求失败：浏览器向Keycloak发送的OPTIONS预检请求未返回所需CORS头。
• Keycloak日志：调试日志无错误，认证流程看似正常执行。

已尝试的解决方法 #

1. Keycloak配置：
   • 确认Web Origins和Valid Redirect URIs配置无误。
   • 在Keycloak Docker环境中添加KC_SPI_HOSTNAME_DEFAULT_FORWARDED=true。
2. 前端配置：
   • 验证前端使用的Keycloak客户端正确。
3. Spring Gateway配置：
   • 实现CorsConfigurationSource以允许所有路径的CORS：

@Bean
public CorsConfigurationSource corsConfigurationSource() {
    CorsConfiguration configuration = new CorsConfiguration();
    configuration.addAllowedOrigin("http://localhost:3000");
    configuration.addAllowedMethod("*");
    configuration.addAllowedHeader("*");
    configuration.setAllowCredentials(true);
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    source.registerCorsConfiguration("/**", configuration);
    return source;
}

4. Keycloak HTTP配置：
   • 尝试通过KC_RESPONSE_HEADERS为Keycloak显式添加Access-Control-Allow-Origin，无效果。
5. Keycloak主题修改：
   • 尝试修改Keycloak登录页Freemarker模板（login.ftl）添加CORS头元标签，但不想依赖这种临时方案。

约束条件 #

• 出于安全考虑，不能开放所有源（*）。
• 不希望用反向代理处理Keycloak的CORS问题。

问题 #

1. 为何已正确配置Web Origins，Keycloak仍不返回包含Access-Control-Allow-Origin的CORS响应头？
2. 是否遗漏了特定的Keycloak配置或Docker设置以确保正确处理CORS？
3. Keycloak v26.0.7是否存在已知的CORS问题，或有更优的调试/预防方法？

额外上下文 #

浏览器错误示例：

Access to fetch at 'http://localhost:8090/realms/testrealm/protocol/openid-connect/auth' from origin 'http://localhost:3000' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.

说明
本场景中，后端服务器是OAuth 2.0流程中的客户端，而非前端服务器。即后端服务器向Keycloak认证服务器发起认证请求，用户仅在需要时执行认证操作。

流程

1. :3000/test → 点击按钮（向后端:8080/success-page发送请求）
2. (302重定向) → :8080/oauth2/authorization/keycloak
3. (302重定向) → :8090/realms/testrealm/protocol/openid-connect/auth/...

CORS错误详情
• 从前端服务器重定向至Spring Boot后端服务器（:8080）时无CORS错误。
• 问题出在从后端服务器（:8080）重定向至Keycloak认证服务器（:8090）的步骤。
• 此步骤中Origin头变为null。
• Keycloak检测到null origin，因此不在响应中包含CORS相关头。
• 浏览器收到无所需头的Keycloak响应后触发CORS错误。

问题解答 #

1. 为何配置Web Origins后仍无CORS头？

核心原因是重定向链导致Origin头丢失为null：前端向后端发请求时带Origin: http://localhost:3000，但后端302重定向到Keycloak时，浏览器不会保留原Origin，反而会把Origin设为null（跨域第三方跳转的浏览器默认行为）。Keycloak的Web Origins配置仅在请求携带合法Origin头时才会返回CORS头，当Origin为null时，Keycloak默认不会添加任何CORS相关响应头，直接触发浏览器的CORS拦截。

2. 遗漏的配置/设置？

针对Origin为null的场景，需要让Keycloak允许此类请求返回CORS头，具体操作：

• Keycloak客户端配置：在控制台对应客户端的Web Origins设置中，添加+符号（代表允许null Origin），保存后重启Keycloak。
• Docker环境变量补充：给Keycloak添加环境变量KC_SPI_CORS_ALLOW_NULL_ORIGIN=true，强制Keycloak对null Origin的请求返回CORS头。

另外可检查Spring Gateway的重定向逻辑：确保后端重定向时没有修改或清除请求头，但更可靠的解决方式是在Keycloak端配置。

3. Keycloak v26.0.7的CORS问题及调试方法

Keycloak v26.0.7本身没有广泛报告的严重CORS问题，但针对null Origin场景需要显式配置。

• 调试方法：
  1. 用curl模拟带null Origin的请求，查看响应头：

     curl -H "Origin: null" -v http://localhost:8090/realms/testrealm/protocol/openid-connect/auth?client_id=你的客户端ID&redirect_uri=http://localhost:8080/login/oauth2/code/keycloak&response_type=code
     

  2. 查看Keycloak调试日志，搜索CORS关键字，确认是否识别到Origin并处理。
• 预防方法：
  • 客户端Web Origins除了添加合法源，额外添加+覆盖null Origin场景。
  • 若业务允许，改为前端直接发起Keycloak认证，避免后端重定向导致的Origin丢失，此时Origin会保持为前端地址，Keycloak会正常返回CORS头。

内容的提问来源于stack exchange，提问作者June