Laravel Sanctum 在嘗試獲取經過身份驗證的用戶時返回 401

Question

我想在我的 React SPA 啟動時獲取當前登錄的用戶，這樣我就可以顯示用戶的信息，但是每次我嘗試從我的 Laravel 后端獲取它時，我都會得到 401。

我正在為我的 API 使用 Laravel + Sanctum，並在前端的不同項目中使用 React。

后端：

我的AuthController controller 中有以下內容：

public function user()
    {
        return auth()->user();
    }

在我的路線api.php我有以下路線：

    Route::group(['middleware' => ['auth:sanctum']], function () {
        Route::get('/user', [AuthController::class, 'user']);
        Route::post('/logout', [AuthController::class, 'logout']);
    });

我的.env文件包含以下內容：

SANCTUM_STATEFUL_DOMAINS=localhost:3000
SESSION_DOMAIN=localhost

前端：

我有一個包含以下內容的上下文：

 useEffect(() => {
    apiClient()
      .get("/api/user")
      .then((res) => {
        setUser(res.data.user);
      });
  }, []);

如果您想知道，我的apiClient()來自這里：

import axios from "axios";

const apiClient = () => {
  const api = axios.create({
    baseURL: "http://localhost:8000",
    withCredentials: true,
    headers: {
      Accept: "application/json",
    },
  });

  return api;
};

export default apiClient;

此上下文位於應用程序的頂層。

我不確定發生了什么，我的路由/登錄按預期工作，我發送請求並接收用戶信息作為我設置為 React state 的響應。 在頁面刷新此 state 被刪除，因為這就是 Javascript 的工作原理。 我想使用上面提到的useEffect再次設置它，所以當用戶在關閉瀏覽器后加載 web 應用程序時，他們仍然可以看到他們的信息。

提前致謝！

Answer 1

要驗證您的 SPA，您的 SPA 的“登錄”頁面應首先向 /sanctum/csrf-cookie 端點發出請求，以初始化應用程序的 CSRF 保護：

axios.get('/sanctum/csrf-cookie').then(response => {
    //Login...
});

有關更多信息，請查看https://laravel.com/docs/8.x/sanctum#spa-authentication