Fixing ‘unauthenticated error’ while using Laravel Sanctum for SPA.

Step-by-step guide on fixing the issue.

You may be working locally with the Laravel project; scaffolded a front-end app with React/Vue/Angular and when making requests to routes wrapped within auth:sanctum middleware, you may get an unauthenticated error. It is because of misconfigurations. Let’s fix this.

  1. Make sure the laravel app is serving from localhost ( by doing the good old php artisan serve. Do not use virtual hosts because you cannot serve the front-end apps from the same virtual host.
  2. Check the port numbers of your front-end app. Usually, React app serves at http://localhost:3000 and Vue app serve from http://localhost:8080.
  3. It is necessary for the front-end app(s) and the laravel app to serve from the same domain — localhost in our case.
  4. Set sanctum stateful domains in .env file. These are the addresses of our front-end apps including the port numbers.

Set session domain in .env file. You need to change this at production to your domain name.


Set paths and supports_credentails in cors.php The routes of web.php you wish to have access to in your front-end app should be added to the paths array.

'paths' => ['api/*', 'login', 'register', 'otp/*', 'sanctum/csrf-cookie'],
'supports_credentials' => true,

And finally, you should make requests from the front-end app to the localhost/api/other-route but not to using axios.


#laravel sanctum