diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
new file mode 100644
index 0000000..5513a5c
--- /dev/null
+++ b/src/components/ui/table.tsx
@@ -0,0 +1,114 @@
+import * as React from "react"
+
+import { cn } from "@/lib/utils"
+
+function Table({ className, ...props }: React.ComponentProps<"table">) {
+ return (
+
+ )
+}
+
+function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
+ return (
+
+ )
+}
+
+function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
+ return (
+
+ )
+}
+
+function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
+ return (
+
tr]:last:border-b-0",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
+ return (
+ |
+ )
+}
+
+function TableHead({ className, ...props }: React.ComponentProps<"th">) {
+ return (
+ [role=checkbox]]:translate-y-[2px]",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function TableCell({ className, ...props }: React.ComponentProps<"td">) {
+ return (
+ | [role=checkbox]]:translate-y-[2px]",
+ className
+ )}
+ {...props}
+ />
+ )
+}
+
+function TableCaption({
+ className,
+ ...props
+}: React.ComponentProps<"caption">) {
+ return (
+
+ )
+}
+
+export {
+ Table,
+ TableHeader,
+ TableBody,
+ TableFooter,
+ TableHead,
+ TableRow,
+ TableCell,
+ TableCaption,
+}
diff --git a/src/lib/http.ts b/src/lib/http.ts
index efdc2cb..4d8ebb4 100644
--- a/src/lib/http.ts
+++ b/src/lib/http.ts
@@ -1,17 +1,89 @@
-import axios from 'axios';
+import axios from "axios";
+import useUserStore from "@/store/useUserStore";
+import { refreshToken } from "@/api/user";
-const request = axios.create({
- baseURL: '/api', // 指向你的 Java SpringBoot 后端地址
- timeout: 10000,
+const service = axios.create({
+ baseURL: "/api", // 指向你的 Java SpringBoot 后端地址
+ timeout: 60000,
});
-// 响应拦截器
-request.interceptors.response.use(
- (response) => response.data,
+service.interceptors.request.use(
+ (config) => {
+ const { token } = useUserStore.getState();
+ if (token) {
+ config.headers.Authorization = `${token.tokenType} ${token.accessToken}`;
+ }
+ return config;
+ },
(error) => {
- console.error('网络请求出错:', error);
+ // 对请求错误做些什么
return Promise.reject(error);
- }
+ },
);
-export default request;
\ No newline at end of file
+// 记录是否正在刷新中
+let isRefreshing = false;
+// 存储因为等待刷新而挂起的请求
+let requestsQueue: Array<(token: string) => void> = [];
+
+// 响应拦截器
+service.interceptors.response.use(
+ (response) => response.data,
+ async (error) => {
+ const { config, response } = error;
+
+ // 如果是 401 错误且不是正在刷新的请求本身
+ if (response && response.status === 401 && !config._retry) {
+ if (isRefreshing) {
+ // 如果正在刷新，将请求暂存，返回一个未解析的 Promise
+ return new Promise((resolve) => {
+ requestsQueue.push((token) => {
+ config.headers["Authorization"] = `Bearer ${token}`;
+ resolve(service(config));
+ });
+ });
+ }
+
+ // 标记正在刷新，开启重试锁
+ config._retry = true;
+ isRefreshing = true;
+
+ try {
+ const { token } = useUserStore.getState();
+
+ // 发送刷新请求
+ const res = await refreshToken(token!.refreshToken);
+
+ if (res.code == 0) {
+ const access_token = res.data.accessToken;
+ useUserStore.setState((state) => ({
+ ...state,
+ token: res.data,
+ }));
+ // 执行队列中的请求
+ requestsQueue.forEach((callback) => callback(access_token));
+ requestsQueue = [];
+ // 重发当前请求
+ config.headers["Authorization"] = `Bearer ${access_token}`;
+ return service(config);
+ }
+ } catch (refreshError) {
+ // 刷新也失败了（如 refresh_token 过期），只能重新登录
+ console.error("Token 刷新失败:", refreshError);
+ useUserStore.setState((state) => ({
+ ...state,
+ token: undefined,
+ isLogin: false,
+ }));
+ return Promise.reject(refreshError);
+ } finally {
+ isRefreshing = false;
+ }
+ }
+
+ console.error("网络请求出错:", error);
+ return Promise.reject(error);
+ },
+);
+
+export default service;
diff --git a/src/pages/Article.tsx b/src/pages/Article.tsx
new file mode 100644
index 0000000..f2b3db0
--- /dev/null
+++ b/src/pages/Article.tsx
@@ -0,0 +1,53 @@
+import { Button } from "@/components/ui/button";
+import {
+ Table,
+ TableBody,
+ TableCaption,
+ TableCell,
+ TableHead,
+ TableHeader,
+ TableRow,
+} from "@/components/ui/table";
+export default function Article() {
+ return (
+ <>
+
+
+
+
+
+ A list of your recent invoices.
+
+
+ 标题
+ 状态
+ 发布日期
+ 浏览量
+ 收藏量
+ 点赞量
+ 点踩量
+ 操作
+
+
+
+
+ INV001
+ Paid
+ Credit Card
+ $250.00
+ Paid
+ Credit Card
+ $250.00
+
+
+
+
+
+
+
+
+
+
+
+ 用户登录
+
+
+
+
+
+ usernameChange(e.target.value)}
+ id="username"
+ placeholder="请输入用户名"
+ className="mb-1 flex-9"
+ />
+
+
+ {loginErrMsg.usernameBlank ? (
+
+ {loginErrMsg.usernameBlank}
+
+ ) : (
+ ""
+ )}
+
+
+
+
+
+ passwdChange(e.target.value)}
+ id="passwd"
+ placeholder="请输入密码"
+ className="mb-1 flex-9"
+ type="password"
+ />
+
+
+ {loginErrMsg.passwdBlank ? (
+
+ {loginErrMsg.passwdBlank}
+
+ ) : (
+ ""
+ )}
+
+
+
+
+
+ ![]() refreshCaptcha()}
+ className="mt-2 w-16 h-6 absolute left-48 hover:cursor-pointer"
+ src={captcha == null ? "#" : captcha}
+ alt="点击刷新"
+ />
+ verifyChange(e.target.value)}
+ id="verifyCode"
+ placeholder="请输入验证码"
+ className="mb-1 flex-9"
+ />
+
+
+ {loginErrMsg.verifyBlank ? (
+
+ {loginErrMsg.verifyBlank}
+
+ ) : (
+ ""
+ )}
+
+
+ agreeChenge(check)}
+ />
+
+ 同意
+
+ 《用户及隐私协议》
+
+
+
+
+
+
+
+
+
+
@@ -298,7 +318,7 @@ function Register() {
htmlFor="passwd1"
className="w-20 font-light text-sm flex-1"
>
- 再次输入密码:
+ 确认密码:
{sepasswdErrorMsg ? (
@@ -312,13 +332,13 @@ function Register() {
emailChangeEvent(e.target.value)}
/>
| 
-