webAuth popup authentication doesn't work as expected

Help
, ,
1

I’m using auth0.js to achieve popup based authorisation.
I’m working on a SPA with React. My problem is that the popup won’t close after the authorisation is done. The app gets started in the popup itself.
I think the documentation lacks details on the popup part.

Here’s what I have so far:
webAuth = new auth0.WebAuth({
domain: ‘DOMAIN’,
clientID: ‘CLIENTID’,
redirectUri: ${HOST}/callback,
responseType: ‘token id_token’,
scope: ‘openid profile email picture’
})

    webAuth.popup.authorize(
      { connection: 'facebook' },
      (err, authResult) => {
        console.error('loginFacebook popup, err', err)
        console.info('login Facebook popup, authResult', authResult)
      }
    )

Any help will be appreciated.

2

:wave: @laveesingh is this happening in a particular browser? What version of the Auth0.js library are you using? Can you try specifying the popupOrigin and make sure the redirectUri and the popupOrigin both match the website origin (full domain)?

Using the popup for authorization can sometimes cause issues in some browsers (and different versions of the same browser) depending on how popups are handled. Popups must be explicitly enabled in some browsers, such as Chrome I believe, so we typically recommend using a redirect mode.

1 Like
3

I am facing the same issue and it is not browser specific.
webAuth = new auth0.WebAuth({
domain: ‘DOMAIN’,
clientID: ‘CLIENTID’,
redirectUri: ${HOST}/callback ,
responseType: ‘token id_token’,
scope: ‘openid profile email picture’
})

webAuth.popup.authorize(
{ connection: ‘google-oauth2’ },
(err, authResult) => {
console.log(‘login Google popup, err’, err, authResult)
)