尝试注销 vue3 laravel sainttum 帐户时出现 500 错误

Question

我写了一个身份验证表单，登录、注册和接收用户对我有用，但注销对我不起作用，用户可以登录帐户，但他不能再注销。

这样我就不会尝试更改它，但我仍然捕获 500 个错误，并且在 laravel 中出现这样的日志：Method Illuminate\Auth\Request Guard::logout 不存在。

我在各个论坛上查看了有关此问题的几个讨论，但没有任何帮助，但现在我什至不知道我是否可以在 SPA 中注销我的帐户。

文件 api.php:

Route::middleware(['web'])->group(function () {
   Route::post('/login', LoginController::class)->name('login');
   Route::post('/register', RegisterController::class)->name('register');
   Route::post('/logout', LogoutController::class)->middleware('auth:sanctum');
   Route::get('/user', GetUserController::class)->middleware('auth:sanctum');
});

输出控制器：

public function __invoke(Request $request)
{
    Auth::guard("web")->logout();
    $request->session()->invalidate();
    $request->session()->regenerateToken(); 

    return response()->json(['message' => 'Logged out']);
}

pinia的正面有这样的代码：

import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import axios from 'axios';

axios.defaults.baseURL = 'http://localhost:8000';
axios.defaults.withCredentials = true;
axios.defaults.withXSRFToken = true;

export const useAuthStore = defineStore('auth', () => {
  const user = ref(null);

  const getCsrfToken = async () => {
    await axios.get('/sanctum/csrf-cookie');
  };

  const login = async (email, password) => {
    try {
      await getCsrfToken(); // получаем CSRF токен
      await axios.post('/api/login', { email, password });
      await getUser(); // получаем информацию о пользователе
    } catch (error) {
      console.error('Login error', error);
      throw error;
    }
  };

  const register = async (name, email, password) => {
    try {
      await getCsrfToken();
      await axios.post('/api/register', { name, email, password });
    } catch (error) {
      console.error('Registration error', error);
      throw error;
    }
  };

  const logout = async () => {
    try {
      // await getCsrfToken();
      const response = await axios.post('/api/logout');
      console.log('Ответ от API:', response);
      user.value = null;
    } catch (error) {
      console.error('Logout error', error);
      throw error;
    }
  };


  const getUser = async () => {
    try {
      await getCsrfToken();
      const response = await axios.get('/api/user');
      user.value = response.data;
      console.log(user.value);
    } catch (error) {
      console.error('Get user error', error);
      user.value = null;
    }
  };

  const isAuthor = computed(() => user.value?.role === "author");
  const isAdmin = computed(() => user.value?.role === "admin");

  return {
    user, isAuthor, isAdmin,
    login, register, logout, getUser,
  };
})

我按照 Laravel sanctum 文档中所写的那样做了所有事情

文档中有一些未完成的内容，或者我不知道。

我真的不想给这样一个残疾人留下一个账户，但还是做一个有退出可能性的普通账户。

如果有人遇到过这样的问题并以某种方式解决了它，那么我会很高兴知道如何解决。

Answer 1

首先，您需要了解 Sanctum 有两个特点。

“API Token 身份验证”和“SPA 身份验证”。

您真的了解两者之间的区别以及应该使用哪一个吗？

目前您正在使用“SPA 身份验证”。

如果您确定“SPA 身份验证”是正确的选择，那么您应该做的是使用 Breeze API 堆栈。

Breeze API 堆栈提供“SPA 身份验证”的所有身份验证功能。

自己编写验证码是错误所在。官方的 Laravel 入门套件是最正确的使用方法。