【问题标题】:Keycloak with nuxt-auth module带有 nuxt-auth 模块的 Keycloak
【发布时间】:2021-01-23 09:57:04
【问题描述】:

我正在使用 this auth-module 和 Keycloak。

我在 nuxt.config.js 中的配置:

keycloak: {
    _scheme: 'oauth2',
    client_id: 'client-bo',
    userinfo_endpoint: 'SERVER/protocol/openid-connect/userinfo',
    authorization_endpoint: 'SERVER/protocol/openid-connect/auth',
    //userinfo_endpoint: false,
    access_type: 'offline',
    access_token_endpoint: 'SERVER/protocol/openid-connect/token',
    //response_type: 'code',
    response_type: 'token id_token',
    token_type: 'Bearer',
    token_key: 'access_token',
    scope: ['openid', 'profile', 'email'],
    redirect_uri: 'http://127.0.0.1:3000/'        
}

连接正常。

当我点击“连接”按钮时,我被重定向到我的 Keycloak 环境。一旦通过 Keycloak 的身份验证,我就会被重定向到我的 nuxt.js 应用程序。

但是,问题是我的商店是空的。您对导致此问题的原因有任何想法吗?

loggedIn: 总是false

user: 总是null

你能告诉我为什么它不起作用吗?

【问题讨论】:

    标签: javascript vue.js oauth-2.0 nuxt.js keycloak


    【解决方案1】:

    我遇到了类似的问题。我不得不禁用本地身份验证。因此,在我的 nuxt 配置中,我必须设置以下选项:

    auth: {
        strategies: {
          local: false,
          keycloak: {...}
    

    希望这会有所帮助。 (我猜你需要重定向到页面上的 auth 中间件)

    【讨论】:

      【解决方案2】:

      vuex 商店有一个选项,也许这有帮助:

              watchLoggedIn: true,
              resetOnError: true,
              redirect: {
                login: '/login',
                logout: '/',
                callback: '/login',
                home: '/welcome'
              },
              vuex: {
                namespace: 'auth'
              },
              strategies: {
                keycloak: {
                  _scheme: 'oauth2',
                  authorization_endpoint: ...
      

      您使用的是哪个版本的 nuxt 身份验证?我猜您的商店设置正确,您可以从中获取其他商品的价值?

      【讨论】:

        【解决方案3】:

        我遇到了类似的问题,终于可以通过以下配置让它工作:

        package.json

         "@nuxtjs/auth-next": "5.0.0-1607534757.1122b76"
        

        nuxt-config.json

        auth: {
        keycloak: {
            scheme: 'oauth2',
            endpoints: {
                authorization: `${process.env.KEYCLOAK_HOST}/auth/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/auth`,
                userInfo: `${process.env.KEYCLOAK_HOST}/auth/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/userinfo`,
                token: `${process.env.KEYCLOAK_HOST}/auth/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/token`,
                logout: `${process.env.KEYCLOAK_HOST}/auth/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/logout?redirect_uri=` + encodeURIComponent(String(process.env.HOME_URI))
            },
            token: {
                property: 'access_token',
                type: 'Bearer',
                name: 'Authorization',
                maxAge: 1800 // Can be dynamic ?
            },
            refreshToken: {
                property: 'refresh_token',
                maxAge: 60 * 60 * 24 * 30 // Can be dynamic ? 
            },
            responseType: 'code',
            grantType: 'authorization_code',
            clientId: process.env.KEYCLOAK_CLIENT_ID,
            scope: ['openid', 'profile', 'email'],
            codeChallengeMethod: 'S256',
        },
            redirect: {
                logout: '/',
                callback: '/',
                home: '/dashboard'
            },
        }
        

        登录功能:

         login() {
          this.$auth.loginWith("keycloak");
        },
        

        我看到 GitHub 报告了有关 Nuxt 身份验证模块的问题,但能够使其与此配置一起使用。希望这对某人有所帮助。

        【讨论】:

        • 非常感谢它对我有用,我也遵循了这个教程:tliebrand.com/19-programming/…
        • 请注意,nuxt auth 模块仍处于开发模式,可能会引入重大更改,我无法让版本 5.0.0-1613647907.37b1156 工作
        猜你喜欢
        • 2020-09-18
        • 1970-01-01
        • 2020-10-23
        • 2019-05-10
        • 2021-07-22
        • 1970-01-01
        • 2021-08-07
        • 2021-01-19
        • 2021-02-01
        相关资源
        最近更新 更多