Is the Auth module compatible with the Http module rather than axios? If so, is there a guide?

By any chance is there a enable auth0 popup login ?

Version

v4.8.5

Reproduction link

https://sweeps.ai

Steps to reproduce

1. Configure your Nuxt website with Sentry support and auth with a local endpoint such as:
   user: { url: "/auth/users/me/", method: "get", propertyName: "username" }

2. Every page will now fire a request to /auth/users/me to see if we are authenticated.

3. If you're not, the server will respond with 401.

What is expected ?

Nothing to happen

What is actually happening?

Sentry will catch the 401 response as an unhandled exception and fill up your logs with an error you have nothing to do about.

Additional comments?

I assume auth should catch this 401 so that it won't be caught as an error by other tools.

Version

v4.8.5

Reproduction link

https://google.se

Steps to reproduce

Somehow the defined POST is converted to a GET request.

   auth: {
        redirect: {
            login: '/login',
            logout: '/',
            callback: '/login',
            home: '/profile'
        },
        strategies: {
            local: false,
            password_grant: {
                _scheme: 'local',
                endpoints: {
                    loginn: {
                        url: '/oauth/token',
                        method: 'post',
                        propertyName: 'access_token'
                    },
                    logout: false,
                    user: {
                        url: '/api/admin/user',
                        method: 'get',
                        propertyName: 'data'
                    }
                }
            }
        }
    },

If I change the request method to PATCH/PUT it sends the request as PATCH/PUT

What is expected ?

A POST request is made

What is actually happening?

A GET request is made

Answering my own question, auth-module does handle the job on its own: https://github.com/nuxt-community/auth-module/blob/26f597a30e052cf81fb8dad89cf633446f7eb5c4/lib/schemes/oauth2.js#L187

Answering my own question, auth-module does handle the job on its own: https://github.com/nuxt-community/auth-module/blob/26f597a30e052cf81fb8dad89cf633446f7eb5c4/lib/schemes/oauth2.js#L187

Given the three tests I've done, I am making here a recap for clarity

1. Mode SPA — example-auth0 repository https://github.com/nuxt-community/auth-module/issues/536#issue-568235358
   Reproduction link: https://nuxt.federicod.dev/

Application stays stuck at the callback page, not storing the auth0 token, in the chance that this was an issue with the example-auth0 repo alone I've tested also the example build in the auth-module repo.

1. Mode SPA — auth-module repository https://github.com/nuxt-community/auth-module/issues/536#issuecomment-589557690
   Reproduction link: https://auth-test.federicod.dev/

Same as above, I now think that the issue resides indeed in the auth-module itself.

1. Mode SSR (universal) — auth-module repository https://github.com/nuxt-community/auth-module/issues/536#issuecomment-589600857
   Reproduction link: https://auth-test-ssr.federicod.dev/

After trying to build the SSR version of the example\demo application, and serving it with nuxt start I have confirmed that the auth-module either:

• doesn't work at all in SPA mode;

* the build command with the SPA configuration breaks something

Mode SPA — example-auth0 repository

Version

v4.8.5

Reproduction link

https://nuxt.federicod.dev/

Steps to reproduce

1. git clone https://github.com/nuxt/example-auth0.git;
2. set Auth0 domain and client_id into nuxt.config.js (I am not using the .env file as it seems to me that it doesn't get embedded in the SPA after running npm run build)
3. set mode: spa
4. nuxt build
5. deploy the dist folder
6. access the website and try to login with [email protected]; [email protected]
7. after the callback URL is opened, it stays stuck there

On a more complicated platform I am developing, some API calls that are made on the callback URL to populate a Vuex store all yields unauthorized error, meaning that the token doesn't get stored at all.

When running example-auth0 and the application I am developing in development mode with npm run dev, everything works fine. So I suppose that something goes wrong only after running the build command.

What is expected ?

I expect the callback URL to be opened and the token received stored.

What is actually happening?

The SPA stays stuck at the callback URL and no token is stored.

Additional comments?

Webserver: Caddy
Configuration:

nuxt.federicod.dev {
        root /root/dev/example-auth0/dist
}

No errors are shown in the console.

I initially posted it to the example-auth0 repo but I figured the issue fits most here in the core auth-module.

https://github.com/nuxt/example-auth0/issues/76

I would happily provide more infos if I can help debut more the issue.

Hello, I am using google identity toolkit form my credentials and it hasn't and enpoint to get user data, so in my api i havent eather the user endpoint but, in my login i have a response with the user data, and the refresh token, so i need to catch them but i don't know the way.
this is my nuxt.config:

`auth: {
strategies: {
local: {
endpoints: {
login: {
url: 'login',
method: 'post',
propertyName: 'data.idToken'
},
user: false,
logout: false
}
}
},
redirect: {
login: '/auth/login',
home: '/dashboard',
logout: '/auth/login'
}
}

and this is my login response :
{ "JSON": { "data": { "kind": "identitytoolkit#VerifyPasswordResponse", "localId": "eNRIRZVTSDZp1XIfln2PtPRKiOo1", "email": "[email protected]", "displayName": "Esteban 2", "idToken": "my api token", "registered": true, "refreshToken": "my refresh token", "expiresIn": "3600" }, "message": null, "flow": "success", "statusCode": 200, "error": null } }

i want to user data.email, data.displayName, data.refreshToken, data.localId for setting my user in $auth.user
`

Nuxt's context redirection not working after setUserToken promise. Here the error log

(node:89375) UnhandledPromiseRejectionWarning: Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
    at ServerResponse.setHeader (_http_outgoing.js:535:11)
    at Storage.setCookie (server.js:1266:20)
    at Storage.setUniversal (server.js:1078:10)
    at Auth.setToken (server.js:587:26)
    at Auth.reset (server.js:562:12)
    at server.js:418:16
    at Auth.callOnError (server.js:710:7)
    at server.js:552:12
    at processTicksAndRejections (internal/process/task_queues.js:97:5)

Example code

async asyncData({ $auth, redirect }) {
     $auth.setUserToken(accessToken).then(() => {
        redirect('/home')
      })
  }

I couldn't figure out a way to renew my token using the @nuxtjs/auth package.

i did, however, manage to get a new token by applying the following procedure :

1. porting the SilentAuthenticationHandler from Auth0.js to my project
2. Commenting out one line in the SilentAuthenticationHandler to prevent the browser from freaking out if the /authorize endpoint is on a different domain
3. Creating an instance of SilentAuthenticationHandler with an url that has response_mode web_message and a value for postMessageOrigin that corresponds with my audience
4. Calling the login method on SilentAuthenticationHandler, withusePostMessageset totrue, to open the/authorize` endpoint in a hidden iframe
5. Parsing the hash in the URL of the callback page passed as a redirect_uri and then using Window.parent.postMessage(parsedParams, '*') to send it back to the main window

After taking all of these 5 steps, I finally get my new access token & id token.

Unfortunately, I can't figure out how to update my Nuxt with these new credentials. I looked for inspiration in the @nuxtjs/auth package, but the best I could come up with, is something like this :

this.$auth.setUserToken(token);

I tried combining this with eg. fetchUser & a setUser, but no matter what I try, it keep ***ing up my session and trigger a 400 error upon reload.

What am I doing wrong?

I couldn't figure out a way to renew my token using the @nuxtjs/auth package.

i did, however, manage to get a new token by applying the following procedure :

1. porting the SilentAuthenticationHandler from Auth0.js to my project
2. Commenting out one line in the SilentAuthenticationHandler to prevent the browser from freaking out if the /authorize endpoint is on a different domain
3. Creating an instance of SilentAuthenticationHandler with an url that has response_mode web_message and a value for postMessageOrigin that corresponds with my audience
4. Calling the login method on SilentAuthenticationHandler, withusePostMessageset totrue, to open the/authorize` endpoint in a hidden iframe
5. Parsing the hash in the URL of the callback page passed as a redirect_uri and then using Window.parent.postMessage(parsedParams, '*') to send it back to the main window

After taking all of these 5 steps, I finally get my new access token & id token.

Unfortunately, I can't figure out how to update my Nuxt with these new credentials. I looked for inspiration in the @nuxtjs/auth package, but the best I could come up with, is something like this :

this.$auth.setUserToken(token);

I tried combining this with eg. fetchUser & a setUser, but no matter what I try, it keep ***ing up my session and trigger a 400 error upon reload.

What am I doing wrong?

For the platform I'm currently working on (which runs on Nuxt), my employer decided to outsource authentication to Auth0.

We managed to get the login and logout flows to work, using the auth-module, by opening a hosted page on Auth0 and redirecting to our platform after succesful login / logout.

According to the official Auth0 documentation, Auth0 allows two method for renewing an existing authorization token :

• silent authentication requests, for tokens that have not expired yet
• a silent token request in a hidden iframe, for tokens that have expired

For the first option, the documentation tells me I should to a get request to the following URL :

https://████████████████████/authorize
    ?response_type=id_token token&
    client_id=...&
    redirect_uri=...&
    state=...&
    scope=openid...&
    nonce=...&
    audience=...&
    response_mode=...&
    prompt=none

When I open this URL in any tab of my browser, I am indeed correctly redirected to the redirect_uri, if this redirect_uri is listed in the Auth0 config. And a new token is added to the url after an #.

I am, however, unable to get this to work with XHR, either from the backend or the frontend. When I try doing this from the frontend, my browser complains that this resource didn't set CORS headers. When I try doing this from the backend, I can't find a way to pass my credentials to the URL.

I have also been looking for documentation on how to do this in Nuxt specifically, but I could not find any documentation at all. Does your plugin support renewal in background, either for expired or non-expired tokens? And if so, is there any documentation on how to do this?

nuxt.config.js

strategies: {
      local: {
        endpoints: {
          login: {
            url: "/api/personal",
            method: "post",
            // propertyName: "data.token"
            propertyName: "data.token"
          },
          logout: false,
          user: false
        },
        tokenType: false
      }
    }

Login.vue

methods: {
    async submit() {
      this.loginMsg = false;
      if (!this.username) {
        return this.$refs.name.focus();
      } else if (!this.password) {
        return this.$refs.pwd.focus();
      }
      let body = {
        data: {
          username: this.username,
          password: this.password,
          appId: this.appId,
          clientId: this.clientID,
          deviceType: "ios"
        },
        url: "https://27.102.66.228/liuhe/login"
      };
      const x = await this.$auth.loginWith("local", {
        data: body
      });
      // this.$auth.setUser(user);
   }
}

My data return of my login API already contains both the user data and login. So how do I deal with that based on this module? An example return would be something like:

{"code":1,"msg":"成功","data":{"token":"xxxxx","kickLastLogin":true,"userDTO":{"userId":165194,"phoneNumber":"123456","nickName":"xxxx","imageUrl":"http://example/images/20180709/165194_1531141185978.jpg","ryToken":"xxxx==","locked":false},"userData":{"userId":165194,"gold":0,"userName":null,"safeCode":null},"userWinDTO":null,"userProfessorTitle":null,"authenticationList":["ROLE_COMMON"],"cashQuanlification":true}}

When I authorize user using local schema I get on my other endpoints which are used afterwards errors with code 401 that the request is unauthorized.

When I reload the page I am authorized and endpoints are working fine.

Following the provided demo code, I'm able to grab basic profile information through a Sign-In button but when I specify the scope to be: https://www.googleapis.com/auth/spreadsheets.readonly in my nuxt.config.js file, I get a 401 Error: Invalid Credentials when I login from the GET request on the URL: https://www.googleapis.com/oauth2/v3/userinfo.

My aim is to allow users to sign in, consent to reading Google Sheets files and then allow users to select a specific Google Sheets to read for my website to analyze.

Is there an additional thing I need to do to make this work? Is the token I'm obtaining somehow invalid? I've run this on an Incognito window and the same error shows up. I found a token generated in my local storage Bearer ... and I tried manually creating an HTTP request with that Authorization onto the URL above and I received the same error so that may be the source of everything.

But, how do I fix this then?

The docs say "you can also write your own provider" but there are no instructions on how to do so.

I've got an oauth API that requires client_secret. I can see how the github and laraval providers use the addAuthorize technique to allow this. I'd be happy to add my own provider, but I don't see a way I could load it.

Related: #462

sorry, I have made a silly mistake and I didn't change this.$router.push('/home') to my new route inside login.vue