如何使用 Keycloak 配置 CORP？答案

【问题标题】：How configure CORP with Keycloak?如何使用 Keycloak 配置 CORP？
【发布时间】：2021-10-10 15:38:13
【问题描述】：

我得到了以下设置：

https://localhost:1234 -> React 应用使用 keycloak-js 和 @react-keycloak/web http://localhost:8080 -> Keycloak (docker)

React 应用被配置为使用 keycloak 实例。

如果我尝试访问我的 web 应用程序，我会收到以下网络错误：

GET http://localhost:8080/auth/realms/REALMNAME/protocol/openid-connect/3p-cookies/step1.html
not-set cross-origin-resource-policy

我的浏览器阻止了请求，因为缺少 cross-origin-resource-policy 标头。

如果我在 https://localhost:1234 上托管我的 react 应用程序并在 https://id.domain.de 上使用高效的密钥斗篷，则会出现同样的错误，因此 ssl 似乎没有问题。

如果我在具有不同子域的服务器上使用我的高效密钥斗篷和高效反应应用程序，它确实有效。（https://id.domain.de 和 https://ui.domain.de）。

任何想法如何解决这个问题？ :)

【问题讨论】：

标签： docker security localhost keycloak cross-origin-resource-policy

【解决方案1】：

您必须为您的 react 应用 url 启用 Web 来源。我相信您的客户的 Web Origin 已启用为您工作的那个。您可以为Realms -> Client -> Select Client-> Web Origins 的部分启用 Web-Origin

网络起源

此选项以 CORS 为中心，代表跨域资源共享。如果浏览器 JavaScript 尝试向域与 JavaScript 代码所在域不同的服务器发出 AJAX HTTP 请求，则该请求必须使用 CORS。服务器必须以特殊的方式处理 CORS 请求，否则浏览器将不会显示或不允许处理请求。该协议的存在是为了防止 XSS、CSRF 和其他基于 JavaScript 的攻击。

【讨论】：