带有 nuxt-auth 模块的 Keycloak

Question

我正在将这个 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

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

Answer 1

我遇到了类似的问题，最终能够使用以下配置让它工作：

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'
    },
}

登录function：

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

我看到 GitHub 在 Nuxt Auth 模块上报告了问题，但能够让它与这个配置一起工作。 希望这对某人有帮助。

Answer 2

我有一个类似的问题。 我不得不禁用本地身份验证。 所以在我的 nuxt 配置中，我必须设置以下选项：

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

希望这可以帮助。 （而且我猜你需要在你重定向到的页面上使用 auth 中间件）

Answer 3

vuex store 有一个选项，也许这有帮助：

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

您使用的是什么版本的 nuxt auth？ 我想您的商店设置正确，您可以从中获取有关其他商品的价值吗？