manchenkoff/nuxt-auth-sanctum

[Bug] Unable to load user identity from API

Closed this issue · 2 comments

Describe the bug

While fetching the user data, a nuxt-auth-sanctum:csr:error Unable to load user identity from API TypeError: Cannot read properties of undefined (reading 'set') is triggered.

To Reproduce

Just updated Nuxt and the nuxt-auth-sanctum to the last version and the error appears.

Expected behavior

The errors should not be triggered and user must be able to use the app as usual

Actual behavior

This bug break the login workflow since the user cannot access protected routes

Module information

  • Version: 0.5.0
  • Content of your nuxt.config.ts:
export default defineNuxtConfig({
  devtools: {enabled: true},
  ssr: false,

  runtimeConfig: {
    public: {
      apiBase: process.env.NUXT_PUBLIC_API_BASE,
    }
  },

  css: ['~/assets/css/main.css'],
  modules: ['@pinia/nuxt', "nuxt-auth-sanctum", "shadcn-nuxt"],

  shadcn: {
    prefix: '',
    componentDir: './components/ui'
  },

  pinia: {
    storesDirs: ['./stores/**'],
  },

  postcss: {
    plugins: {
      tailwindcss: {},
      autoprefixer: {},
    },
  },

  sanctum: {
    baseUrl: process.env.NUXT_PUBLIC_API_BASE,
    redirectIfAuthenticated: true,
    logLevel: 5,
    endpoints: {
      user: '/api/v1/user'
    },
    redirect: {
      onLogin: '/app/home'
    }
  },

  devServer: {
    host: "0.0.0.0"
  },

  compatibilityDate: '2024-10-09'
})

Nuxt environment:

  • Version: 0.5.0
  • SSR Enabled: no
  • Environment: local / production

Laravel environment:

  • Version: 11.27.2
  • Sanctum installed via Breeze: yes
  • Checklist completed: yes
  • What is your session domain in config/session.php: localhost
  • What is your stateful domains in config/sanctum.php: 'stateful' => explode(',', env('SANCTUM_STATEFUL_DOMAINS', sprintf( '%s%s%s', 'localhost,localhost:3000,127.0.0.1,127.0.0.1:8000,::1', Sanctum::currentApplicationUrlWithPort(), env('FRONTEND_URL') ? ','.parse_url(env('FRONTEND_URL'), PHP_URL_HOST) : '' ))),
  • Content of config/cors.php:
<?php

return [
    'paths' => ['sanctum/csrf-cookie', 'auth/*', 'login', 'register', 'logout', 'api/*'],

    'allowed_methods' => ['*'],

    'allowed_origins' => [env('FRONTEND_URL', 'lachargerie.xyz'), 'http://localhost:3000'],

    'allowed_origins_patterns' => [],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => true,

];

Additional context

It seems the headers argument is undefined in the runtime/utils/headers. I bypass it by adding this the second line in the runtime/utils/headers.ts

export function appendRequestHeaders(headers, append) {
  headers = headers ?? new Headers
  
  for (const [key, value] of Object.entries(append)) {
    headers.set(key, value); // error line
  }
  return headers;
}

The weird thing is the headers are set like before but this error block the workflow.

Hey @donovanbroquin, please upgrade ofetch to ^1.4.0 version and let me know if the issue persists.

Similar to #195

Hi!

Thank you for the upgrade indication and the previous ticket. Everything is good now!
Sorry, I quickly read the #195 but didn't understand that it was the same thing.