Laravel Sanctum Nuxt 用戶注冊錯誤

Question

我有一個 Laravel API，我使用 Laravel Sanctum 實現了身份驗證，我正在使用homestead 。 我正在嘗試連接我的 Nuxt SSR 前端。 目前，我遇到了一個我似乎不明白的問題，我已經進行了搜索，但無論如何都可以看到任何類似的問題。

問題是我什至無法從 Nuxt 應用程序注冊用戶。 當我向注冊路由發出請求時，我收到CSRF token mismatch錯誤。

• API域： api.myapp.test
• 前端域： myapp.test:3000

向http://api.myapp.test/v1/register發送 POST 請求會返回CSRF token mismatch錯誤。

有什么我沒有做對的嗎？

以下是我的 Laravel 配置：

cors.php

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

    'allowed_methods' => ['*'],

    'allowed_origins' => ['*'],

    'allowed_origins_patterns' => [],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => true,

];

session.php

[
   'domain' => '.myapp.test',
]

sanctum.php

return [
    'stateful' => [
        'myapp.test:3000', 'api.myapp.test'
    ],

];

我在我的前端使用 nuxt/axios。 nuxt.config.js

{
// Even if I remove the credentials property, is still does not work
  axios: {
    credentials: true
  },
}

我真的很困惑，因為當我從Postman發出相同的請求時我沒有收到錯誤。

Answer 1

我建議你使用 @nuxt/auth-module 它為 Laravel Sanctum 內置了策略。 正如文檔中所述：

注意：強烈建議使用代理來避免 CORS 和同站點策略問題：

{
  axios: {
    proxy: true,
    credentials: true
  },
  proxy: {
    '/laravel': {
      target: 'https://laravel-auth.nuxtjs.app',
      pathRewrite: { '^/laravel': '/' }
    }
  },
  auth: {
    strategies: {
      'laravelSanctum': {
        provider: 'laravel/sanctum',
        url: '<laravel url>'
      }
    }
  }
}

然后通過您的控制器手動注冊后，您可以立即使用以下方法登錄用戶：

this.$auth.loginWith('laravelSanctum', {
  data: {
    email: '',
    password: ''
  }
})

Answer 2

從您的問題中不清楚您是否在嘗試調用注冊端點之前調用了必要的'/sanctum/csrf-cookie'端點。 如果你不是，好消息 - 修復非常簡單！ 在嘗試其他人之前，只需向 csrf cookie 端點發送GET請求，您應該會發現您的 CSRF 錯誤已解決。

文檔在這里：

https://laravel.com/docs/8.x/sanctum#csrf-protection

編輯：郵遞員工作，因為 CORS 是基於瀏覽器的協議。 Postman 不是瀏覽器，並且根本不在乎服務器是否使用其他適當的 CORS 標頭進行響應。