feat: 调整博客页以支持slug

apps/frontend/app/(with-header-footer)/blog/[id]/page.tsx

@@ -27,17 +27,8 @@ async function parseBlogParams({ params: paramsPromise, searchParams: searchPara
         }
     }
 
-    const hex = Array.from(base62.decode(params.id as string)).map(b => b.toString(16).padStart(2, '0')).join('');
-    const id = [
-        hex.slice(0, 8),
-        hex.slice(8, 12),
-        hex.slice(12, 16),
-        hex.slice(16, 20),
-        hex.slice(20, 32)
-    ].join('-');
-
     return {
-        id,
+        id: params.id,
         p: searchParams.p,
     }
 }
@@ -50,7 +41,7 @@ async function getBlog(paramsResult: ReturnType<typeof parseBlogParams>) {
         }
     } else {
         try {
-            const data = await BlogAPI.getBlog(`${id}`, p);
+            const data = await BlogAPI.getBlogBySlug(`${id}`, p);
             return {
                 data,
             }
@@ -83,7 +74,7 @@ export default async function Page({ params, searchParams }: PageRouteProps) {
     let { errorMsg } = res;
 
     const data = errorMsg ? null
-        : await BlogAPI.getBlog(`${id}`, p).catch(e => handleAPIError(e, ({ message }) => { errorMsg = message; return null }));
+        : await BlogAPI.getBlogBySlug(`${id}`, p).catch(e => handleAPIError(e, ({ message }) => { errorMsg = message; return null }));
 
     return (
         <div className="w-full overflow-x-hidden">

apps/frontend/app/(with-header-footer)/blog/page.tsx

@@ -4,7 +4,6 @@ import {
     AlertTitle,
 } from "@/components/ui/alert";
 import { AlertCircle } from "lucide-react";
-import { base62 } from "@/lib/utils";
 import { BlogAPI } from "@/lib/api/server";
 import { handleAPIError } from "@/lib/api/common";
 
@@ -18,13 +17,10 @@ const formatNumber = (num: number): string => {
     return num.toString();
 };
 
-const getBlogDetailUrl = (id: string): string => {
-    const cleanId = id.replace(/-/g, '');
-    const encoded = base62.encode(Buffer.from(cleanId, 'hex'));
-    return `/blog/${encoded}`;
+const getBlogDetailUrl = (slug: string): string => {
+    return `/blog/${slug}`;
 };
 
-
 export const metadata = {
   title: '日志 - 特恩的日志',
   description: '我随便发点，你也随便看看～',
@@ -56,7 +52,7 @@ export default async function Blog() {
                         <h2 className="text-2xl font-medium">
                             <a
                                 className="hover:underline focus:outline-none focus:ring-2 focus:ring-zinc-400 rounded"
-                                href={getBlogDetailUrl(blog.id)}
+                                href={getBlogDetailUrl(blog.slug)}
                                 rel="noopener noreferrer"
                             >
                                 {blog.title}

apps/frontend/lib/api/endpoints/blog.server.ts

@@ -3,16 +3,17 @@ import { serverFetch } from "../server";
 
 export async function list() {
     return serverFetch<Pick<Blog,
-        'id' | 'title' | 'description' | 'viewCount' | 'createdAt' | 'updatedAt' | 'deletedAt'
+        'id' | 'title' | 'slug' | 'description' | 'viewCount' | 'createdAt' | 'updatedAt' | 'deletedAt'
     >[]>('/api/blog')
 }
 
-export async function getBlog(id: string, password?: string) {
+export async function getBlogBySlug(slug: string, password?: string) {
     return serverFetch<{
         id: string;
         title: string;
         description: string;
         createdAt: string;
         content: string;
-    }>(`/api/blog/${id}` + (password ? `?p=${password}` : ''));
-}
+    }>(`/api/blog/${slug}/slug` + (password ? `?p=${password}` : ''));
+}
+