React native error Invalid state received in redirect URL

Help
1

I’m getting error: “state Invalid state recieved in redirect url”

I’m using hosted pages with Lock as below

var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
      auth: {
        redirectUrl: config.callbackURL,
         responseType: (config.internalOptions || {}).response_type ||
          config.callbackOnLocationHash ? 'token' : 'code',
        params: {
            scope: 'openid'
        }
      },
      assetsUrl:  config.assetsUrl,
      allowedConnections: 'facebook', 'twitter'],
      rememberLastLogin: !prompt,
      language: language,
      languageDictionary: {
        title: 'Log in'
      },
      theme: {
        logo: 'https://s3-us-west-2.amazonaws.com/rune-public/images/icon256.png',
        //primaryColor:    'green'
      },
      prefill: loginHint ? { email: loginHint, username: loginHint } : null,
      // uncomment if you want small buttons for social providers
      socialButtonStyle: 'big',
      closeable: true
    });
2

The template that makes use of Lock in the hosted login page sets the auth.params property of the options to config.internalOptions. However, in your code sample, you replaced that with params: { scope: 'openid' } which means Lock is not configured correctly with the internal options required to its use as part of the hosted login page.

In general, the scope parameter is sent from the application so I also fail what is the exact use case you require that lead you to having a configuration such as that one. Nonetheless, the reason for the error in question is the incorrect configuration of Lock; you’ll need to make use of the internal options.

3

Thanks for your response.

So here my client code :

 {
            auth0
                .webAuth
                .authorize({ scope: 'openid email', audience: 'https://example.com/userinfo' })
                .then(credentials => {
                    console.log(credentials)
                }
                // Successfully authenticated
                // Store the accessToken
                ).catch((error) => {
                    console.log(error);
                });
        }

here is my hosted page loc initialization :

var lock = new Auth0Lock(config.clientID, config.auth0Domain, {
      auth: {
        redirectUrl: config.callbackURL,
         responseType: 'token',
        params: config.internalOptions
      },
      assetsUrl:  config.assetsUrl,
      allowedConnections: 'facebook', 'twitter'],
      rememberLastLogin: !prompt,
      language: language,
      languageDictionary: {
        title: 'Log in'
      },
      theme: {
        logo: 'xyz.png',
        //primaryColor:    'green'
      },
      prefill: loginHint ? { email: loginHint, username: loginHint } : null,
      // uncomment if you want small buttons for social providers
      socialButtonStyle: 'big',
      closeable: true
    });

    lock.show();

here is the response that comes to ios with url value:
example.native://xxxxxx-xxxxx.auth0.com/ios/example.native/callback?code=adfadsfadsdsse&state=adsfasfadsasdfasdafd-qYoFVJGvtAesUg

Now if i call authorize again then i get the credential then to execute. what am i doing wrong?