This does not explain why you would get a nonce does not match error when not trying to specify a custom nonce anywhere (this was the part that I could not reproduce). However, if you want to try to workaround the error you got by providing your own nonce value then you can try the following:
var options = { auth: {} };
options.autoclose = true;
options.oidcConformant = true;
options.auth.redirectUrl = window.location.origin;
options.auth.responseType = "id_token token";
options.auth.nonce = '...'; // Your nonce here
var lock = new Auth0Lock("client_id", "domain", options);
When showing Lock you would pass the additional parameters:
var options = { auth: { params: {} } };
options.auth.params.state = "..."; // your state here
options.auth.params.scope = 'openid';
options.auth.params.audience = "..."; // your API identifier
lock.show(options);
Have in mind that the options passed to the show
method are not equivalent to the ones passed to the constructor so you should not be extending them and passing the same object (it’s recommended that you use different objects). The option for the show
method are meant for you to override/pass only specific options and one the option that you can override is the auth.params
.
I’m assuming you want want to pass a specific state at the time of showing Lock so you should pass all your auth.params
when showing the Lock and in an independent object. With the above configuration I had no issues locally. Also, the usage of Lock 10 with OIDC conformance is still not yet formally documented so this should be much more straightforward when that is put on paper.