Auth0 Universal window is logged-in if we close the window without login

[mdixit]

Hi

We are using Javascript SPA SDK. https://cdn.auth0.com/js/auth0-spa-js/1.9/auth0-spa-js.production.js.

Issue: when we are trying to login via the universal login window then it works perfectly but if we don’t login with this Auth0 window and try to close this auth0 modal window, it does login into our system. can you please help us to resolve this issue?

Thanks

[stephanie.chamblee]

Hi @mdixit,

Just to make sure I understand, when the user is logged out and they open up the Universal Login modal and then they close the modal without inputting credentials, they are then logged in?

Would you mind sending a snippet of code where you call loginWithPopup so that I can try to reproduce the behavior?

For example:

$('#loginPopup').click(async () => {
  await auth0.loginWithPopup();
});

Thanks!

[mdixit]

Yes you are right, below is the code

export async function isAuthenticated() {
return await auth0.isAuthenticated();
}

export async function login() {
const response = { status: false };
try {
await auth0.loginWithPopup({
prompt: “login”
});
} catch (err) {
if (err.message == “Could not open popup”) {
//auth0InfoMessage(“Could not open popup”, “You need to set ‘blocked popup’ setting to false, from your browser settings and will have to login again.”);
auth0InfoMessage(“Please allow popups to save your work.”, “Make sure that you’ve set your browser to allow popups and try again.”);
}
}

if (isAuthenticated()) {
    response.status = true;
    response.token = await getAccessToken();
}
return response;

}
$('#login-btn).click(async () => {
await login();
});

[stephanie.chamblee]

I tried reproducing the issue where the user is logged in without entering credentials, but unfortunately, I’m not seeing it happen in my app.

To recreate it, I replaced the login function in the vanilla JS quickstart with:

const login = async () => {
  const response = { status: false };
  try {
    await auth0.loginWithPopup({
      prompt: "login"
    });
  } catch (err) {
    if (err.message == "Could not open popup") {
      //auth0InfoMessage(“Could not open popup”, “You need to set ‘blocked popup’ setting to false, from your browser settings and will have to login again.”);
      auth0InfoMessage("Please allow popups to save your work.”, “Make sure that you’ve set your browser to allow popups and try again.");
    }
  }
  if (auth0.isAuthenticated()) {
    response.status = true;
    response.token = await auth0.getTokenSilently();
  }
  return response;
}

The app does not authenticate unless I provide my credentials in the popup as it should.

Does this happen in all browsers in both incognito or normal windows?

[mdixit]

Yes right,
we are facing this issue in all browsers.

Actually It happens, when I try to login first and do logout, and then again open modal window and close window without providing credentials.
Below is the code which I am using for logout from the Auth0.
auth0.logout({
localOnly: true
});

[stephanie.chamblee]

It might be the localOnly option that is passed to the logout function. According to the documentation, when localOnly is passed as true, the application has to take care of the local logged out state because there is no redirect.

When true, this skips the request to the logout endpoint on the authorization server, effectively performing a “local” logout of the application. No redirect should take place, you should update local logged in state. This option cannot be specified along with the federated option.

Does this behavior happen when localOnly: true is ommitted?

[tuanlinhchi]

I fix follow code:

} catch (err) {
    if (err.message == "Could not open popup") {
      //auth0InfoMessage(“Could not open popup”, “You need to set ‘blocked popup’ setting to false, from your browser settings and will have to login again.”);
      auth0InfoMessage("Please allow popups to save your work.”, “Make sure that you’ve set your browser to allow popups and try again.");
    }
  }

by:

const openPopup = (url = '') => {
    const width = 400;
    const height = 600;
    const left = window.screenX + (window.innerWidth - width) / 2;
    const top = window.screenY + (window.innerHeight - height) / 2;

    return window.open(
        url,
        'auth0:authorize:popup',
        `left=${left},top=${top},width=${width},height=${height},resizable,scrollbars=yes,status=1`
    );
};

let fakePopup = openPopup();

...

if (fakePopup) {
    fakePopup.close();
}

By default the popup will be blocked if the operating system sees it as not coming from the user. However, if the popup is generated from the user’s “click” action, it will not be blocked. So I create a button for the user to click and automatically create a fake popup.