hookehuyr

feat(认证): 添加用户登出功能

在用户接口中添加登出API,并在认证上下文中实现异步登出逻辑,确保用户登出时清理状态和本地存储信息
/*
* @Date: 2025-03-23 23:45:53
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-03-26 12:24:03
* @LastEditTime: 2025-03-26 16:09:46
* @FilePath: /mlaj/src/api/users.js
* @Description: 用户相关接口
*/
......@@ -9,6 +9,7 @@ import { fn, fetch } from './fn';
const Api = {
USER_LOGIN: '/srv/?a=user_login',
USER_LOGOUT: '/srv/?a=user_logout',
USER_REGISTER: '/srv/?a=user_register',
USER_INFO: '/srv/?a=user_info',
USER_UPDATE: '/srv/?a=user_edit',
......@@ -23,6 +24,11 @@ const Api = {
export const loginAPI = (params) => fn(fetch.post(Api.USER_LOGIN, params));
/**
* @description: 用户登出
*/
export const logoutAPI = (params) => fn(fetch.post(Api.USER_LOGOUT, params));
/**
* @description: 用户注册
* @param: name 用户名称
* @param: mobile 手机号
......
/*
* @Date: 2025-03-20 21:11:31
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-03-24 01:10:13
* @LastEditTime: 2025-03-26 16:11:58
* @FilePath: /mlaj/src/contexts/auth.js
* @Description: 认证上下文管理模块,提供用户认证状态管理、登录登出功能
*/
// 导入Vue的组合式API相关函数
import { ref, provide, inject, onMounted } from 'vue'
import { logoutAPI } from '@/api/users'
// 创建认证上下文的Symbol key,用于provide/inject依赖注入
// 使用Symbol确保key的唯一性,避免命名冲突
......@@ -88,13 +89,20 @@ export function provideAuth() {
* 用户登出函数
* 清理用户状态和本地存储的认证信息
*/
const logout = () => {
const logout = async () => {
try {
const { code } = await logoutAPI()
if (code) {
// 清空当前用户状态
currentUser.value = null
// 清理本地存储的用户信息和登录时间戳
localStorage.removeItem('currentUser')
localStorage.removeItem('loginTimestamp')
}
} catch (error) {
console.error('Failed to logout:', error)
}
}
/**
* 提供认证上下文给子组件使用
......