nuxt-community / auth-module

Zero-boilerplate authentication support for Nuxt 2
https://auth.nuxtjs.org
MIT License
1.93k stars 925 forks source link

Keycloak with oauth2 - No login redirection with app on server, but runs locally #1858

Closed foulong closed 11 months ago

foulong commented 1 year ago

Version

module: 5.0.0-1667386184.dfbbb54 nuxt: 2.17.1

Nuxt configuration

mode:

Nuxt configuration

export default {
  modules: [
    ["nuxt-buefy", { css: false }],
    "@nuxtjs/axios",
    "@nuxtjs/auth-next",
  ],
  auth: {
    strategies: {
      local: false,
      keycloak: {
        scheme: "oauth2",
        endpoints: {
          authorization: `${process.env.GRUDU_URL}/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/auth`,
          userInfo: `${process.env.GRUDU_URL}/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/userinfo`,
          token: `${process.env.GRUDU_URL}/realms/${process.env.KEYCLOAK_REALM}/protocol/openid-connect/token`,
          logout:
            `${process.env.GRUDU_URL}/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: 18000,
        },
        refreshToken: {
          property: "refresh_token",
          maxAge: 60 * 60 * 24 * 30,
        },
        responseType: "code",
        grantType: "authorization_code",
        clientId: process.env.KEYCLOAK_CLIENT_ID,
        scope: ["openid", "profile", "email", "roles"],
        codeChallengeMethod: "S256",
      },
    },
    redirect: {
      login: "/login",
      callback: "/logging",
      logout: "/",
      home: "/",
    },
  },
  router: {
    middleware: ["auth"], 
  },
};

Reproduction

It's difficult because the problem (see below) take place on another machine (server (Debian 10)) and not on my laptop (Windows 10) (the same with other collegues (windows 11)).

What is expected?

Navigate with my browser on my website (http://192.168.100.171:3707), then click on protected page. Redirection to Keycloak login page (http://192.168.100.171:3702/auth/realms/XXXXX/protocol/openid-connect/auth?protocol=oauth2&response_type=code&access_type&client_id=XXXXXXX&redirect_uri=http%3A%2F%2F127.0.0.1%3A3707%2Flogging&scope=openid%20profile%20email%20roles&state=gPdrs7kAHv&code_challenge_method=S256&code_challenge=9t0bv_YBPzGWXTIVHnutT3DfNLAXrmM49gIrnvdy500

What is actually happening?

Navigate with my browser on my website, then click on protected page. No redirection but errors :

server console : ERROR window is not defined 17:45:39

at runtime_Oauth2Scheme.generateRandomString (server.js:4782:5) at runtime_Oauth2Scheme.login (server.js:4636:32) at runtime_Auth.login (server.js:3657:46) at server.js:3651:51 at async i.beforeCreate (pages/login.js:40:7)

browser console : TypeError: window.crypto.subtle is undefined NuxtJS 94 _sha256 pkceChallengeFromVerifier login login loginWith promise callback*loginWith

Steps to reproduce

Additional information

It works on my laptop (environment dev and production). Navigate with my browser on my website (http://127.0.0.1:3707), then click on protected page. I redirected on keycloak login page. Perfect !

Checklist

I answered with my constraint (node v14.18) :

I can add informations according to your comments. Thx in advance.

foulong commented 11 months ago

My environment must be full HTTPS, or localhost.

"crypto" is available in secure context.

https://developer.mozilla.org/fr/docs/Web/API/Crypto/subtle

This article says : """Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers."""

HTTPS nuxtJS app (with self signed SSL certificate) and keycloak with SSL certificate (not self signed).

I would prefer full self signed SSL certificate because internal test server.