Auth-module: Google - Invalid URL

Created on 13 Dec 2020  路  2Comments  路  Source: nuxt-community/auth-module

Version

module: 5.0.0-1607693598.34d83ea
nuxt: 2.14.11

Nuxt configuration

mode:

  • [x] universal

    Nuxt configuration

  auth: {
    redirect: {
      login: '/login',
      logout: '/logout',
      callback: '/loggedin',
      home: '/'
    },
    strategies: {
      google: {
        clientSecret: 'xxx',
        clientId: 'xxx',
        codeChallengeMethod: ''
        // responseType: 'code',
        // accessType: 'offline',
        // grantType: 'authorization_code'
      }
    }
  },

What is expected?

Return to callback page

What is actually happening?

I am successfully returned to the callback page however an error is being thrown in the console which seems to break the whole process

client.js:97 TypeError: Failed to construct 'URL': Invalid URL  
    at parseURL (index.browser.js:28)  
    at normalizeURL (index.browser.js:39)  
    at getLocation (utils.js:305)  
    at _callee2$ (index.js:141)  
    at tryCatch (runtime.js:62)  
    at Generator.invoke [as _invoke] (runtime.js:296)  
    at Generator.prototype.<computed> [as next] (runtime.js:114)  
    at asyncGeneratorStep (asyncToGenerator.js:3)  
    at _next (asyncToGenerator.js:25)

The link is as follows:

http://localhost:3000/login#state=xxx&access_token=xxx&token_type=Bearer&expires_in=3599&scope=email%20profile%20openid%20https://www.googleapis.com/auth/userinfo.profile%20https://www.googleapis.com/auth/userinfo.email&authuser=4&hd=xxx&prompt=none
\
When adding the following code to nuxt.config.js

responseType: 'code', accessType: 'offline', grantType: 'authorization_code'

The result is the the same link with a questionmark instead of a hash
http://localhost:3000/login?state=xxx&access_token=xxx&token_type=Bearer&expires_in=3599&scope=email%20profile%20openid%20https://www.googleapis.com/auth/userinfo.profile%20https://www.googleapis.com/auth/userinfo.email&authuser=4&hd=xxx&prompt=none

Steps to reproduce

  1. Create a nuxt app
  2. Add nuxt-auth-next
  3. Add config for google as above
  4. Call $auth.loginWith('google')

Create

Checklist

  • [x] I have tested with the latest Nuxt version and the issue still occurs
  • [x] I have searched the issue tracker and this issue hasn't been reported yet
  • [x] I have tested with the latest module version and the issue still occurs
bug

Most helpful comment

Ran into the same thing here.

Looks like an issue with the @nuxt/ufo dependency. The hasProtocol function relies on this regex: /\w+:\// which returns a false positive on the return url from Google:

Edit: looks like there's already a PR open on the ufo repo that should fix this: https://github.com/nuxt-contrib/ufo/pull/4/files

All 2 comments

Ran into the same thing here.

Looks like an issue with the @nuxt/ufo dependency. The hasProtocol function relies on this regex: /\w+:\// which returns a false positive on the return url from Google:

Edit: looks like there's already a PR open on the ufo repo that should fix this: https://github.com/nuxt-contrib/ufo/pull/4/files

Looks like that PR was merged and released; please let us know if this issue persists.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

DougHayward picture DougHayward  路  4Comments

nikkanetiya picture nikkanetiya  路  3Comments

essamamdani picture essamamdani  路  3Comments

dasisyouyu picture dasisyouyu  路  3Comments

sebmor picture sebmor  路  3Comments