Integration Issue with Laravel and VueJS: "The JWT string must contain two dots" Error in Auth0 Callback

Help
,
1

Hello Auth0 Community,

I’m working on integrating Auth0 for authentication in a Laravel (v11.x) and VueJS (v2.x) application. I’m running into a persistent issue related to JWT handling in the callback process, and I’m hoping for some guidance.

Setup Details:

  • Laravel Version: 11.x
  • VueJS Version: 2.x
  • Laravel Passport Version: 12.3.x
  • Auth0 SDK Version: 7.15.0

My goal is to use Auth0 to handle OAuth authentication while maintaining Laravel Passport functionality. Here’s a summary of the integration setup and the issues I’ve encountered.

I’ve setup a dev environment in Auth0 with an app and an api. I’ve also setup a Google connection and am testing authentication using a Google account.

Issue Summary:

After implementing Auth0 login, I’m receiving the following error during the callback process:

The JWT string must contain two dots

This appears to indicate a malformed or incomplete JWT token.

Steps Taken to Resolve the Issue:

  1. Session and State Configuration: I ensured SESSION_DRIVER is set to file in .env, enabled stateful login, and session management in config/auth0.php. This resolved initial session errors but led to JWT-related issues.
  2. Audience and Token Configuration:
  • Created a custom API in Auth0 with RS256 signing and set the identifier to https://yourapp.example.com/api.
  • Set AUTH0_AUDIENCE in the Laravel .env file to match this API identifier.
  • Configured config/auth0.php with the response type as code, enabled PKCE, and added necessary scopes (openid, profile, email).
  1. Token Debugging Attempts:
  • Verified that AUTH0_RESPONSE_TYPE is set to code in .env.
  • Enabled debugging in the Auth0 SDK and added logging in Laravel’s CallbackController to capture token responses.
  • Logged the callback response, inspected the middleware handling token exchange, and validated configurations in Auth0’s dashboard.
  1. Additional Observations:
  • I noticed the callback response from Auth0 includes only code and state but lacks an ID token, even though openid is included in the scopes.
  • I’ve repeatedly cleared the Laravel cache to ensure configurations are correctly applied.

Potential Cause Suspected:

The issue might be related to an audience misconfiguration, as I’ve seen invalid JWT-related errors even after creating a custom API and setting the audience explicitly in .env. Additionally, my token response doesn’t appear to include a well-formed JWT (no ID token), which might indicate a misconfiguration in the token exchange process or missing parameters.

Questions for the Community:

  1. Audience and Token Configuration: Are there any additional steps required in Auth0 or Laravel to ensure that a valid JWT with all expected segments is returned?
  2. Default Audience Settings: I couldn’t find a way to set a default audience in Auth0’s API Authorization settings. Could this be contributing to the issue? If so, how can I work around it?
  3. Callback Response Structure: Is there a way to ensure that the callback response includes an ID token, or would I need to configure additional settings in Auth0 to ensure this?

Any insights or advice would be highly appreciated, as I’ve hit a bit of a wall with this configuration. Thank you in advance for your help!

3

Hi @rubenlifesaver,

Welcome to the Auth0 Community!

It seems that the audience query parameter might not have been included in the login request even though you specified it in the .env file. Could you please check your network settings to ensure that the login request includes the audience query parameter?

It should look something like the following:

https://devtest321.us.auth0.com/authorize?
    response_type=code&
    code_challenge={codeChallenge}&
    code_challenge_method=S256&
    client_id=in1QbY7JPM4aXOBacTQJKcBl6K51eLUp&
    redirect_uri={yourCallbackUrl}&
    scope=SCOPE&
    audience={apiAudience}&
    state={state}

(Reference: Call Your API Using the Authorization Code Flow with PKCE)

You should be able to set the Default Audience for your tenant by going to your tenant settings, including the audience identifier as the default audience, and saving your changes.

Please refer to our Tenant Settings documentation.

To get the ID token, you can specify the openid scope in the login request. Then, after exchanging the authorization code for the tokens, you should get both the access and ID tokens. I have ensured that your API settings on Auth0 are correctly configured, and there are no extra steps you need to take here.

Thanks,
Rueben