i have NUXT3 laravel10 and Sanctum application in localhost, i will use SSR mode
am try to login via api using UseFetch nuxt method
{message: “CSRF token mismatch.”, exception: “SymfonyComponentHttpKernelExceptionHttpException”,…}
i get 419 status code in every time

token variable it’s not null

env.php

BROADCAST_DRIVER=log
CACHE_DRIVER=file
FILESYSTEM_DISK=local
QUEUE_CONNECTION=sync
SESSION_DRIVER=cookie  // i set it to cookie
SESSION_LIFETIME=120
MEMCACHED_HOST=127.0.0.1

kernal.php

protected $middleware = [
       // AppHttpMiddlewareTrustHosts::class,
       AppHttpMiddlewareCors::class,
       AppHttpMiddlewareTrustProxies::class,
       IlluminateHttpMiddlewareHandleCors::class,
       AppHttpMiddlewarePreventRequestsDuringMaintenance::class,
       IlluminateFoundationHttpMiddlewareValidatePostSize::class,
       AppHttpMiddlewareTrimStrings::class,
       IlluminateFoundationHttpMiddlewareConvertEmptyStringsToNull::class,
   ];

'api' => [
           IlluminateSessionMiddlewareStartSession::class,
           AppHttpMiddlewareVerifyCsrfToken::class,
           AppHttpMiddlewareCors::class,
           LaravelSanctumHttpMiddlewareEnsureFrontendRequestsAreStateful::class,
           IlluminateRoutingMiddlewareThrottleRequests::class.':api',
           IlluminateRoutingMiddlewareSubstituteBindings::class,
       ],

config/cros.php

'paths' => ['api/*', 'sanctum/csrf-cookie'],

   'allowed_methods' => ['*'],

   'allowed_origins' => ['*','http://localhost:3000'],

   'allowed_origins_patterns' => [],

   'allowed_headers' => ['*'],

   'exposed_headers' => [],

   'max_age' => 0,

   'supports_credentials' => true,
   

config/sanctum.php

'stateful' => explode(',', env('SANCTUM_STATEFUL_DOMAINS', sprintf(
       '%s%s',
       'localhost,localhost:3000,127.0.0.1,127.0.0.1:8000,::1',
       Sanctum::currentApplicationUrlWithPort()
   ))),

in frontend
store/auth.js

async function signIn() {
       // Fetch the CSRF token cookie
       try {
           await useFetch("http://localhost:8000/sanctum/csrf-cookie", {
               credentials: "include",
           });

           // Get the CSRF token from the cookie
           const token = getCookie("XSRF-TOKEN");

           if (!token) {
               console.error('CSRF token not found');
               return;
           }

           // Set CSRF tokens in cookies (if needed)
           setCookie('X-CSRF-TOKEN', token);
           setCookie('X-XSRF-TOKEN', token);

           // Perform login request
           const res = await useFetch(backendUrl + "/login", {
               credentials: "include",
               method: 'POST',
               mode: 'cors',
               body: JSON.stringify({
                   username: 'kminchelle',
                   password: '0lelplR',
               }),
               headers: {
                   "Accept": "application/json",
                   'Content-Type': 'application/json',
                   "X-CSRF-TOKEN": token,
                   "X-XSRF-TOKEN": token,
               },
           });

           // Check for response errors
           if (!res.ok) {
               const errorData = await res.json();
               console.error('Failed to sign in:', errorData.message || res.statusText);
               if (res.status === 419) {
                   // Handle CSRF token expiration
                   location.reload();
               }
               return;
           }

           // Process successful login
           const data = await res.json();
           localStorage.setItem('Atoken', data.token);
           console.log('User:', data);

       } catch (error) {
           console.error('Failed to sign in:', error);
           console.log(document.cookie);
       }
   }