Error state does not match

Help
,
23

The get the state does not match error when I try to login on the sign up page.

24

Just ran into this problem today. Everything was hooked up and working then it just stopped. I’m using auth0-js with react. I use the buildAuthorizeUrl method to launch the hosted login. There is a state param in the url at that point. However on the callback there is no state. It says ‘undefined’. Funny enough if I try and log in again SSO kicks in and I am successfully logged in. For whatever reason state is not sent back with the callback. Any thoughts?

25

I have this problem as well. please advise.

27

:wave: @thefastcat are you still experiencing this issue? If so are you using the Auth0.js library? What version? Angular application? Is this a new application or an existing one that began misbehaving? Can you describe your setup/use case, what you are doing and what is happening?

28

Hi,
Yes I still have the issue. I’m using angular:
“@angular/…”: “4.1.3”
It happens only after upgrading to auth 9 and lock 11
from (it works fine)
“auth0-js”: “8.10.1”,
“auth0-lock”: “10.22.0”,
to (it does not work)
“auth0-js”: “9.5.1”,
“auth0-lock”: “11.6.1”,

I’m not setting ‘state’.

My code is :
lock = new Auth0Lock( …clientID, …domain, {
auth: {
redirectUrl: …callbackURL,
responseType: ‘token id_token’,
params: {
scope: ‘profile openid email’
}}} );
public login() {
let request = ‘&client_id=’ + …clientID;
request = request + ‘&response_type=id_token token’
request = request + ‘&redirect_uri=’ + …callbackURL;
request = request + ‘&nonce=mysfa’
request = request + ‘&scope=profile openid email’
window.location.href = ‘https://…?’ + request;
};

It is stated in documentation that if ‘state is missing it will be generated automatically’

How shall I configure app?
Regards,
Lukasz

29

I want to add that I can reliably reproduce this if I use my app on one browser (say, Safari) and open my magic link in another browser (say, Chrome). It seems like a design flaw that auth0 would require magic links to open in the same browser from which they were sent (if indeed there’s a requirement to read from browser storage as others have suggested). Is there a way to workaround this? I’m not sending state right now, should I be?

30

Also have this issue… ‘state does not match’ when trying to renewAuth/checkSession. I haven’t defined any state myself, so I expect it to be automatic. I don’t have multiple domains or ports to go through, it’s all one SPA.

What do I do?

const authProvider = new auth0.WebAuth({
audience: AUDIENCE,
	clientID: process.env.AUTH0_CLIENT_ID!,
	domain: process.env.AUTH0_DOMAIN!,
	redirectUri: process.env.AUTH0_CALLBACK_URL!,
	responseType: 'token id_token',
	scope: 'openid profile user_metadata',
})

export function login() {
	authProvider.authorize()
}

export function renewAuth() {
	authProvider.renewAuth({}, (result) => {
		console.log('renew res:', result)
		store.dispatch(Actions.User.finishLogin(getUser()!))
	})
}


export function logout() {
	clearSession()
	authProvider.logout({
		returnTo: `${window.location.protocol}//${window.location.host}/logout`
	})
}
31

@lukasz.baranski would you be able to capture a HAR file of the authentication flow where you are experiencing this issue for me to investigate (Generate and Analyze HAR Files)?

@heidi I believe it is the case that the cookies and local states need need to match in order for the authentication to succeed and if they do not then we won’t be able to authenticate the user, due to security reasons. SO I believe it would have to be the same.

@chenasraf was this always working and now it’s throwing this error or are you building a new application and it’s happening from the beginning?