From f1063be9adcb1002e1f0c4005128c05eaa6058d2 Mon Sep 17 00:00:00 2001 From: junleea <354425203@qq.com> Date: Sat, 24 May 2025 20:16:47 +0800 Subject: [PATCH] =?UTF-8?q?=E9=80=9A=E8=BF=87=E7=94=A8=E6=88=B7=E4=B8=AD?= =?UTF-8?q?=E5=BF=83=E6=9D=A5=E7=99=BB=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/user.ts | 5 ++- src/types/user.ts | 16 +++++++ src/utils/request2.ts | 5 --- src/utils/request_fetch.ts | 74 +++++++++++++++++++++++++++++++ src/utils/user_center_request.ts | 76 ++++++++++++++++++++++++++++++++ src/views/pages/login.vue | 36 ++++++++------- src/views/pages/register.vue | 9 ++-- 7 files changed, 194 insertions(+), 27 deletions(-) create mode 100644 src/utils/request_fetch.ts create mode 100644 src/utils/user_center_request.ts diff --git a/src/api/user.ts b/src/api/user.ts index 2b04980..f394f98 100644 --- a/src/api/user.ts +++ b/src/api/user.ts @@ -1,4 +1,5 @@ -import request from '@/utils/request2'; +import request from '@/utils/user_center_request'; +import request2 from '@/utils/request2'; import md5 from 'js-md5'; import {UserUISettings} from '@/types/user'; @@ -141,7 +142,7 @@ export const GetUserStatisticService = (Data) => { for (let key in Data) { params.append(key, Data[key]) } - return request.post('/user/statistic', params,{ + return request2.post('/user/statistic', params,{ headers: { 'token': Data.token, } diff --git a/src/types/user.ts b/src/types/user.ts index 26f80dd..ad95c78 100644 --- a/src/types/user.ts +++ b/src/types/user.ts @@ -99,3 +99,19 @@ export interface UserUISettings { session_id: number; // 会话ID }; } + +// { +// "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3NDgwODg2MDIsImlkIjoxLCJ0eXBlIjoiYWNjZXNzIiwidXNlcm5hbWUiOiJsaWp1biJ9.HJDV_GLkHCEh77GU1tEExmq1RBVv_mYwfQAUEdIFoKw", +// "refresh_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3NDg2ODk4MDIsImlkIjoxLCJ0eXBlIjoicmVmcmVzaCJ9.bDO7a7KLNmI9-EVkVmcEebRVD0-5p-Uq7sThRd-NFqA", +// "user_id": 1, +// "username": "lijun", +// "email": "lijun@ljsea.top" +// }, + +export interface UserToken { + access_token: string; // 访问令牌 + refresh_token: string; // 刷新令牌 + user_id: number; // 用户ID + username: string; // 用户名 + email: string; // 用户邮箱 +} \ No newline at end of file diff --git a/src/utils/request2.ts b/src/utils/request2.ts index 5483add..26b4d8a 100644 --- a/src/utils/request2.ts +++ b/src/utils/request2.ts @@ -22,11 +22,6 @@ request.interceptors.response.use( router.push("/login") return } - if(result.data.code == 7){ - //alert("该用户已存在，请重新输入！"); - ElMessage.error('该用户已存在，请重新输入！'); - return null - } if(result.data.code == 1){ //alert("请求失败，请稍后重试！"); diff --git a/src/utils/request_fetch.ts b/src/utils/request_fetch.ts new file mode 100644 index 0000000..75a7770 --- /dev/null +++ b/src/utils/request_fetch.ts @@ -0,0 +1,74 @@ +// request.ts +import { ElMessage } from 'element-plus' +import router from '@/router/index.js' + +const baseURL = "https://uc.ljsea.top/" + +// 统一错误处理 +const errorHandler = (msg: string = '请求失败，请稍后重试！') => { + ElMessage.error(msg) + return Promise.reject(new Error(msg)) +} + +// 核心请求方法 +const fetchRequest = async (url: string, config?: RequestInit) => { + try { + const fullUrl = new URL(url, baseURL).toString() + const response = await fetch(fullUrl, { + ...config, + //credentials: 'include', // 携带 Cookie + headers: { + 'Content-Type': 'application/json', + ...config?.headers, + }, + }) + + // HTTP 状态码处理 + if (!response.ok) { + router.push("/login") + return errorHandler(`HTTP 错误 ${response.status}`) + } + + // 业务数据处理 + const result = await response.json() + + if (result.message === "NOT_LOGIN" || [2, 3, 4].includes(result.code)) { + ElMessage.error('登录失效，请重新登录！') + localStorage.removeItem("token") + router.push("/login") + return Promise.reject(result) + } + + if (result.code === 1) { + return errorHandler(result.message || '请求失败，请稍后重试！') + } + + return result.data || result + + } catch (error) { + return errorHandler(error instanceof Error ? error.message : '网络连接异常') + } +} + +// 封装不同请求方法 +export default { + get: (url: string, config?: RequestInit) => + fetchRequest(url, { ...config, method: 'GET' }), + + post: (url: string, data?: any, config?: RequestInit) => + fetchRequest(url, { + ...config, + method: 'POST', + body: JSON.stringify(data), + }), + + put: (url: string, data?: any, config?: RequestInit) => + fetchRequest(url, { + ...config, + method: 'PUT', + body: JSON.stringify(data), + }), + + delete: (url: string, config?: RequestInit) => + fetchRequest(url, { ...config, method: 'DELETE' }), +} \ No newline at end of file diff --git a/src/utils/user_center_request.ts b/src/utils/user_center_request.ts new file mode 100644 index 0000000..65e4a12 --- /dev/null +++ b/src/utils/user_center_request.ts @@ -0,0 +1,76 @@ +import axios from "axios"; +import router from "@/router/index.js"; +import Cookies from 'js-cookie'; +import { ElMessage } from 'element-plus'; +//const baseURL = "https://gep.ljsea.top/"; +const baseURL = "https://uc.ljsea.top/"; +//const baseURL= "http://localhost:8084"; +//const baseURL="https://pm.ljsea.top"; +//const baseURL = "https://gep.ljsea.xyz/"; +const request = axios.create({ + baseURL: baseURL, +}); + +request.interceptors.response.use( + result => { + const cookie= Cookies.get("user_token"); + console.log("cookie:", cookie); + + //请求地址 + if(result.config.url == "/user/refresh_token"){ + return result; + } + + if(result.data.message==="NOT_LOGIN"|| [2, 3, 4].includes(result.data.code) || result.status !== 200 ){ + //alert("登录失效，请重新登录！") + refreshToken(); + //重新请求 + //return request(result.config); + } + if(result.data.code == 7){ + //alert("该用户已存在，请重新输入！"); + ElMessage.error('该用户已存在，请重新输入！'); + return null + } + + if(result.data.code == 1){ + //alert("请求失败，请稍后重试！"); + ElMessage.error('请求失败，请稍后重试！'); + }else{ + return result.data + } + }, + error => { + //alert("请求失败，请稍后重试！"); + ElMessage.error('请求失败，请稍后重试！'); + return Promise.reject(error); + } +) + +const refreshToken = async () => { + //读取cookie的信息 + const user_token = Cookies.get("user_token"); + if(user_token == null){ + router.push("/login"); + } + let userTokenInfo = JSON.parse(user_token); + let req_data = await request.post('/user/refresh_token', { + "refresh_token": userTokenInfo.refresh_token + }, { + headers: { + 'token': userTokenInfo.token, + 'Content-Type': 'application/json' // 设置请求头为 JSON 格式 + } + }); + if(req_data.status == 401 || req_data.status == 403){ + //alert("登录失效，请重新登录！"); + ElMessage.error('登录失效，请重新登录！'); + localStorage.removeItem("token"); + router.push("/login") + }else{ + let newAccessToken = req_data.data; + localStorage.setItem("token", newAccessToken); + } +} + +export default request; \ No newline at end of file diff --git a/src/views/pages/login.vue b/src/views/pages/login.vue index b934fc2..973845d 100644 --- a/src/views/pages/login.vue +++ b/src/views/pages/login.vue @@ -79,7 +79,9 @@ import { useRouter } from "vue-router"; import { ElMessage } from "element-plus"; import { loginService } from "@/api/user"; import { GetUserInfoService } from "@/api/user"; +import { UserToken } from "@/types/user"; import { usePermissStore } from "@/store/permiss"; +import Cookies from 'js-cookie'; import {getThirdPartyUUID,getThirdPartyLoginStatus,getGithubLoginUrl,getQQLoginUrl,getThirdPartyLoginUrl} from "@/api/user"; // 从本地存储获取登录参数 const lgStr = localStorage.getItem("login-param"); @@ -236,20 +238,15 @@ const thirdLogin = async (type) => { if(status["status"] === 0) { //登录成功 clearInterval(timer); - let userInfo = status["user_info"]; - let token = userInfo["token"]; - if (!token) { - ElMessage.error("获取登录状态失败！请稍后再试"); - return; - } - - globalData["token"] = token; - localStorage.setItem("token", token); - localStorage.setItem("userId", userInfo["id"]); - localStorage.setItem("username", status["username"]); + let userInfo:UserToken = status["user_info"]; + globalData["token"] = userInfo.access_token; + localStorage.setItem("token", userInfo.access_token); + localStorage.setItem("refresh_token", userInfo.refresh_token); + localStorage.setItem("userId", userInfo.user_id.toString()); + localStorage.setItem("username", userInfo.username); let now = new Date(); localStorage.setItem("end_time", (now.setDate(now.getHours() + 12)).toString()); //过期时间 - await getMyUserInfo(userInfo["id"]); + await getMyUserInfo(userInfo.user_id); return; } }, 2000); @@ -282,13 +279,15 @@ const onLogin = async () => { ElMessage.error("登录失败！用户名或密码错误"); return; } + let userTokenInfo: UserToken = result["data"]; globalData["token"] = result.data; - localStorage.setItem("token", result.data.token); - localStorage.setItem("userId", result.data.id); - localStorage.setItem("username", result.data.username); + localStorage.setItem("token", userTokenInfo.access_token); + localStorage.setItem("refresh_token", userTokenInfo.refresh_token); + localStorage.setItem("userId", userTokenInfo.user_id.toString()); + localStorage.setItem("username", userTokenInfo.username); let now = new Date(); - localStorage.setItem("end_time", (now.setDate(now.getHours() + 12)).toString()); //过期时间 - await getMyUserInfo(result.data.id); + localStorage.setItem("end_time", (now.setDate(now.getHours())).toString()); //过期时间 + await getMyUserInfo(userTokenInfo.user_id); //token.value= result.data; }; @@ -301,12 +300,15 @@ const getMyUserInfo = async (id) => { id: id, }; result = await GetUserInfoService(tokenData); + const cookie= Cookies.get("user_token"); + console.log("cookie:", cookie); if (result["code"] === 0) { //console.log("token data:",this.tokenData) // localStorage.setItem("video_func", result.data.VideoFunc); // localStorage.setItem("device_func", result.data.DeviceFunc); // localStorage.setItem("cid_func", result.data.CIDFunc); // localStorage.setItem("role", result.data.Role); + ElMessage.success("登录成功"); localStorage.setItem("ms_username", result["data"]["Name"]); diff --git a/src/views/pages/register.vue b/src/views/pages/register.vue index 11ce4dd..aeb4a3a 100644 --- a/src/views/pages/register.vue +++ b/src/views/pages/register.vue @@ -64,6 +64,7 @@