refactor(frontend): 完善SSR鉴权与点赞组件样式优化

1. 修正类型文件导入路径到.dev目录
2. 为API请求添加cookie传递支持,实现SSR用户登录态识别
3. 重构LikeButton组件,新增compact变体适配列表页展示
4. 调整首页和板块页的帖子列表布局,添加点赞按钮
5. 拆分帖子列表点击区域,优化交互体验
This commit is contained in:
2026-09-12 01:35:37 +08:00
parent 0c2b0d2d6a
commit a8f6ce4e4f
6 changed files with 76 additions and 40 deletions

View File

@@ -189,17 +189,26 @@ async function fetchWithRefresh(url: string, init: RequestInit): Promise<Respons
// ===== SSR 端 fetch(公开接口,直接请求后端) =====
// SSR 页面通过 (await cookies()).toString() 传入,后端据此识别登录用户并填充 liked 状态
function cookieHeaders(cookieHeader?: string): HeadersInit | undefined {
return cookieHeader ? { Cookie: cookieHeader } : undefined;
}
export async function fetchPosts(
page = 1,
size = 20,
boardId?: number,
sort = "latest",
keyword = ""
keyword = "",
cookieHeader?: string
): Promise<PostsResponse> {
const params = new URLSearchParams({ page: String(page), size: String(size), sort });
if (boardId) params.set("board_id", String(boardId));
if (keyword) params.set("keyword", keyword);
const res = await fetch(`${API_BASE}/api/posts?${params}`, { cache: "no-store" });
const res = await fetch(`${API_BASE}/api/posts?${params}`, {
cache: "no-store",
headers: cookieHeaders(cookieHeader),
});
if (!res.ok) throw new Error("获取帖子失败");
return res.json();
}
@@ -210,8 +219,11 @@ export async function fetchBoards(): Promise<{ boards: Board[] }> {
return res.json();
}
export async function fetchPostDetail(id: string): Promise<{ post: Post }> {
const res = await fetch(`${API_BASE}/api/posts/${id}`, { cache: "no-store" });
export async function fetchPostDetail(id: string, cookieHeader?: string): Promise<{ post: Post }> {
const res = await fetch(`${API_BASE}/api/posts/${id}`, {
cache: "no-store",
headers: cookieHeaders(cookieHeader),
});
if (!res.ok) throw new Error("获取帖子失败");
return res.json();
}
@@ -222,9 +234,12 @@ export async function fetchComments(postId: string): Promise<{ comments: Comment
return res.json();
}
export async function fetchUserProfile(id: string, page = 1): Promise<UserProfile> {
export async function fetchUserProfile(id: string, page = 1, cookieHeader?: string): Promise<UserProfile> {
const params = new URLSearchParams({ page: String(page), size: "20" });
const res = await fetch(`${API_BASE}/api/users/${id}?${params}`, { cache: "no-store" });
const res = await fetch(`${API_BASE}/api/users/${id}?${params}`, {
cache: "no-store",
headers: cookieHeaders(cookieHeader),
});
if (res.status === 404) throw new Error("用户不存在");
if (!res.ok) throw new Error("获取用户资料失败");
return res.json();