首页 > 解决方案 > 如何使用 Keycloak 配置 CORP?

问题描述

我得到了以下设置:

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

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

如果我尝试访问我的 webapp,我会收到以下网络错误:

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 上托管我的反应应用程序并在https://id.domain.de上使用高效的密钥斗篷,则会出现同样的错误,因此 ssl 似乎没有问题。

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

任何想法如何解决这一问题?:)

标签: dockersecuritylocalhostkeycloakcross-origin-resource-policy

解决方案


您必须为您的 react 应用程序 url 启用 Web 来源。我相信您的客户的 Web Origin 已启用为您工作的那个。您可以为部分启用 Web-OriginRealms -> Client -> Select Client-> Web Origins 在此处输入图像描述

网络起源

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


推荐阅读