3

我正在尝试使用本地主机(本地主机:3000)中现有登录页面的密钥斗篷登录。Keycloak 在另一台主机上运行 ( http://kchost:38080 )。我知道这不是推荐的登录方式,但我需要立即调整现有系统。

尝试卷曲:

    curl --location --request POST 'http://kchost:38080/auth/realms/myrealm/protocol/openid-connect/token' \
        --header 'Content-Type: application/x-www-form-urlencoded' \
        --data-urlencode 'client_id=publictestclient' \
        --data-urlencode 'username=myuser' \
        --data-urlencode 'password=mypass' \
        --data-urlencode 'grant_type=password'

我成功获得了预期的响应(使用 access_token 和 refresh_token)。我不能在浏览器上做同样的事情。该错误与 CORS 有关。

我正在使用 axios,这是代码:

axios.defaults.httpsAgent = new https.Agent({ rejectUnauthorized: false })
axios.defaults.crossDomain = true;

await axios({
            method: "POST",
            url: 'http://kchost:38080/auth/realms/myrealm/protocol/openid-connect/token',
            headers: {
               "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
               'Access-Control-Allow-Origin': '*'
            },
            data: {
               client_id: 'publictestclient', 
               username: 'myuser', 
               password: 'mypass', 
               grant_type: 'password', 
           }
})

错误是:CORS 策略已阻止从源“ http://localhost:3000 ”访问“ http://kchost:38080/auth/realms/myrealm/protocol/openid-connect/token ”处的 XMLHttpRequest:请求Access-Control-Allow-Headers 在预检响应中不允许标头字段 access-control-allow-origin。

如果我省略标题'Access-Control-Allow-Origin' : '*',则错误变为:访问 XMLHttpRequest at ' http://kchost:38080/auth/realms/myrealm/protocol/openid-connect/token '来自原点“ http://localhost:3000 ”的 CORS 策略已阻止:请求的资源上不存在“Access-Control-Allow-Origin”标头。

在 Keycloak 管理员端,客户端具有访问类型“public”以避免“clientSecret”要求。Direct Access Grants Enabled 已启用。为“web origins”和“valid redirect url”尝试了不同的配置,当前的配置是:

valid redirect url: localhost*
web origins: *

我很确定这是与服务器配置有关的问题。我该如何解决?

4

2 回答 2

1

有效的重定向 url 前面应该有 http 或 https。因此,对 localhost 有效的可能是: https://localhost/* 如果您想使其安全,则 Web 来源应该类似于 https://localhost。

于 2021-04-15T11:54:11.917 回答
0

实现我使用 REST api openid-connect 和 keycloak 实现身份验证的唯一方法是遵循本教程:https ://javascript.tutorialink.com/keycloak-returns-cors-access-control-allow-origin-error/ 对于我这很神奇,因为我咨询了很多话题。但是像邮递员一样使用 javascript 获取数据,它也适用于我。

在此处输入图像描述

在此处输入图像描述

于 2022-02-25T20:14:44.000 回答