diff --git a/Merge/front/package.json b/Merge/front/package.json
index 5f6553c..ffb677d 100644
--- a/Merge/front/package.json
+++ b/Merge/front/package.json
@@ -3,31 +3,31 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@testing-library/dom": "^10.4.0",
     "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
+    "@mui/icons-material": "^7.1.1",
+    "@mui/material": "^7.1.1",
+    "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^13.5.0",
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0",
-    "react-router-dom": "^6.14.1",
-    "react-scripts": "^5.0.1",
-    "web-vitals": "^2.1.4",
-    "lucide-react": "^0.468.0",
-    "antd": "^4.24.0",
     "ajv": "^8.0.0",
     "ajv-keywords": "^5.0.0",
+    "antd": "^4.24.0",
+    "axios": "^1.9.0",
     "crypto-js": "^4.2.0",
-    "recharts": "^2.1.9",
+    "lucide-react": "^0.468.0",
     "mui": "^0.0.1",
-    "@mui/material": "^7.1.1",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "react-icons": "^5.5.0",
-    "@mui/icons-material": "^7.1.1",
-    "@emotion/styled": "^11.14.0",
-    "axios": "^1.9.0"
+    "react-router-dom": "^6.14.1",
+    "react-scripts": "^5.0.1",
+    "recharts": "^2.1.9",
+    "web-vitals": "^2.1.4"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "start": "cross-env HOST=0.0.0.0 PORT=3000 react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
@@ -49,5 +49,8 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "cross-env": "^7.0.3"
   }
 }
diff --git a/Merge/front/src/api/search_jwlll.js b/Merge/front/src/api/search_jwlll.js
index e18efa3..e75abb0 100644
--- a/Merge/front/src/api/search_jwlll.js
+++ b/Merge/front/src/api/search_jwlll.js
@@ -17,7 +17,25 @@
       },
       ...options
     })
-    return await response.json()
+    
+    // 检查响应状态码
+    if (!response.ok) {
+      let errorData
+      try {
+        errorData = await response.json()
+      } catch {
+        errorData = { error: `HTTP ${response.status}` }
+      }
+      throw new Error(errorData.error || `HTTP ${response.status}`)
+    }
+    
+    // 处理空响应（如204 No Content）
+    const contentType = response.headers.get('content-type')
+    if (contentType && contentType.includes('application/json')) {
+      return await response.json()
+    } else {
+      return {} // 返回空对象而不是尝试解析JSON
+    }
   } catch (error) {
     console.error('API请求错误:', error)
     throw error
@@ -62,8 +80,7 @@
   // 获取帖子详情
   getPostDetail: async (postId) => {
     return await request(`${WZY_BASE_URL}/posts/${postId}`)
-  },
-  // 点赞帖子
+  },  // 点赞帖子
   likePost: async (postId, userId) => {
     return await request(`${WZY_BASE_URL}/posts/${postId}/like`, {
       method: 'POST',
@@ -78,11 +95,10 @@
       body: JSON.stringify({ user_id: userId })
     })
   },
-
   // 查看是否点赞
   hasLiked: async (postId, userId) => {
     const res = await request(
-      `${WZY_BASE_URL}/posts/${postId}/like?user_id=${userId}`,
+      `${WZY_BASE_URL}/posts/${postId}/like/status?user_id=${userId}`,
       {
         method: 'GET'
       }
diff --git a/Merge/front/src/components/PostDetailJWLLL.jsx b/Merge/front/src/components/PostDetailJWLLL.jsx
index b0ca84f..47f905f 100644
--- a/Merge/front/src/components/PostDetailJWLLL.jsx
+++ b/Merge/front/src/components/PostDetailJWLLL.jsx
@@ -1,18 +1,10 @@
-import React, { useState, useEffect, useCallback, useMemo } from 'react'
+import React, { useState, useEffect, useCallback } from 'react'
 import { useParams, useNavigate } from 'react-router-dom'
-import {
-  ArrowLeft,
-  ThumbsUp,
-  MessageCircle,
-  Share2,
-  BookmarkPlus,
-  Heart,
-  Eye,
-} from 'lucide-react'
+import { ArrowLeft, ThumbsUp, MessageCircle, Share2, BookmarkPlus, Heart, Eye } from 'lucide-react'
 import { searchAPI } from '../api/search_jwlll'
 import { getUserInfo } from '../utils/auth'
 import FollowButton from './FollowButton'
-import postsAPI from '../api/posts_api'                // ⇦ 包含 hasLikedPost、likePost、unlikePost
+import postsAPI from '../api/posts_api'
 import MediaPreview from './MediaPreview'
 import '../style/PostDetail.css'
 import dayjs from 'dayjs'
@@ -20,34 +12,24 @@
 export default function PostDetail() {
   const { id } = useParams()
   const navigate = useNavigate()
-
-  // ──────────────── 状态 ────────────────
   const [post, setPost] = useState(null)
   const [loading, setLoading] = useState(true)
   const [error, setError] = useState(null)
-
   const [liked, setLiked] = useState(false)
   const [bookmarked, setBookmarked] = useState(false)
   const [likeCount, setLikeCount] = useState(0)
-
   const [comments, setComments] = useState([])
   const [newComment, setNewComment] = useState('')
   const [showComments, setShowComments] = useState(false)
-
   const [isFollowing, setIsFollowing] = useState(false)
   const [authorInfo, setAuthorInfo] = useState(null)
-
   const [previewImg, setPreviewImg] = useState(null)
-  const [commentUserMap, setCommentUserMap] = useState({})      // user_id → username
-  const [commentUserAvatarMap, setCommentUserAvatarMap] = useState({}) // user_id → avatar
-
-  // 当前登录用户 ID（memo 化，组件整个生命周期只算一次）
-  const currentUserId = useMemo(() => {
-    const ui = getUserInfo()
-    return ui?.id || 'null'          // 未登录就给个默认值 3
-  }, [])
-
-  // ──────────────── 拉取帖子详情 ────────────────
+  const [commentUserMap, setCommentUserMap] = useState({}) // user_id: username
+  const [commentUserAvatarMap, setCommentUserAvatarMap] = useState({}) // user_id: avatar  // 获取当前用户ID
+  const getCurrentUserId = () => {
+    const userInfo = getUserInfo()
+    return userInfo?.id || '3' // 如果未登录或无用户信息，使用默认值3
+  }
   const fetchPostDetail = useCallback(async () => {
     setLoading(true)
     setError(null)
@@ -55,151 +37,153 @@
       const data = await searchAPI.getPostDetail(id)
       setPost(data)
       setLikeCount(data.heat || 0)
-    } catch (err) {
-      console.error('获取帖子详情失败:', err)
+      
+      // 检查当前用户是否已点赞
+      const currentUserId = getCurrentUserId()
+      try {
+        const hasLiked = await searchAPI.hasLiked(id, currentUserId)
+        setLiked(hasLiked)
+      } catch (error) {
+        console.error('检查点赞状态失败:', error)
+        setLiked(false) // 如果检查失败，默认为未点赞
+      }
+    } catch (error) {
+      console.error('获取帖子详情失败:', error)
       setError('帖子不存在或已被删除')
     } finally {
       setLoading(false)
     }
   }, [id])
 
-  // ──────────────── 拉取评论 ────────────────
   const fetchComments = useCallback(async () => {
     try {
       const data = await searchAPI.getComments(id)
       setComments(data.comments || [])
-    } catch (err) {
-      console.error('获取评论失败:', err)
+    } catch (error) {
+      console.error('获取评论失败:', error)
     }
   }, [id])
 
-  // ──────────────── 组件挂载：帖子详情 + 评论 + 点赞状态 ────────────────
-  useEffect(() => {
-    fetchPostDetail()
-    fetchComments()
-
-    // 检查我是否点过赞
-    if (currentUserId) {
-      ;(async () => {
-        try {
-          const res = await postsAPI.hasLikedPost(id, currentUserId)
-          setLiked(!!res.liked)
-        } catch (err) {
-          console.error('检查点赞状态失败:', err)
-        }
-      })()
-    }
-  }, [fetchPostDetail, fetchComments, id, currentUserId])
-
-  // ──────────────── 检查是否关注作者 ────────────────
+  // 检查当前用户是否已关注发帖人
   useEffect(() => {
     if (post && post.user_id) {
+      // 这里假设有API postsAPI.getUserFollowing
       const checkFollow = async () => {
         try {
-          if (!currentUserId) return
-          const res = await postsAPI.getUserFollowing(currentUserId)
+          const userInfo = getUserInfo()
+          if (!userInfo?.id) return
+          const res = await postsAPI.getUserFollowing(userInfo.id)
           if (Array.isArray(res)) {
-            setIsFollowing(res.some((u) => u.id === post.user_id))
+            setIsFollowing(res.some(u => u.id === post.user_id))
           } else if (Array.isArray(res.following)) {
-            setIsFollowing(res.following.some((u) => u.id === post.user_id))
+            setIsFollowing(res.following.some(u => u.id === post.user_id))
           }
         } catch {}
       }
       checkFollow()
     }
-  }, [post, currentUserId])
+  }, [post])
 
-  // ──────────────── 作者信息 ────────────────
+  // 拉取发帖人信息
   useEffect(() => {
     if (post && post.user_id) {
-      postsAPI
-        .getUser(post.user_id)
-        .then((res) => setAuthorInfo(res || {}))
-        .catch(() => setAuthorInfo({}))
+      postsAPI.getUser(post.user_id).then(res => setAuthorInfo(res || {})).catch(() => setAuthorInfo({}))
     }
   }, [post])
 
-  // ──────────────── 拉取评论用户昵称 / 头像 ────────────────
+  // 拉取所有评论用户昵称
   const fetchCommentUserNames = async (userIds) => {
     const map = {}
-    await Promise.all(
-      userIds.map(async (uid) => {
-        try {
-          const user = await postsAPI.getUser(uid)
-          map[uid] = user.username || user.nickname || `用户${uid}`
-        } catch {
-          map[uid] = `用户${uid}`
-        }
-      })
-    )
+    await Promise.all(userIds.map(async uid => {
+      try {
+        const user = await postsAPI.getUser(uid)
+        map[uid] = user.username || user.nickname || `用户${uid}`
+      } catch {
+        map[uid] = `用户${uid}`
+      }
+    }))
     setCommentUserMap(map)
   }
 
+  // 拉取所有评论用户头像
   const fetchCommentUserAvatars = async (userIds) => {
     const map = {}
-    await Promise.all(
-      userIds.map(async (uid) => {
-        try {
-          const user = await postsAPI.getUser(uid)
-          map[uid] =
-            user.avatar && user.avatar.startsWith('http')
-              ? user.avatar
-              : user.avatar
-              ? `http://10.126.59.25:5715/static/${user.avatar}`
-              : `https://i.pravatar.cc/40?img=${uid}`
-        } catch {
-          map[uid] = `https://i.pravatar.cc/40?img=${uid}`
-        }
-      })
-    )
+    await Promise.all(userIds.map(async uid => {
+      try {
+        const user = await postsAPI.getUser(uid)
+        map[uid] = user.avatar && user.avatar.startsWith('http') ? user.avatar : (user.avatar ? `http://10.126.59.25:5715/static/${user.avatar}` : `https://i.pravatar.cc/40?img=${uid}`)
+      } catch {
+        map[uid] = `https://i.pravatar.cc/40?img=${uid}`
+      }
+    }))
     setCommentUserAvatarMap(map)
   }
 
   useEffect(() => {
+    fetchPostDetail()
+    fetchComments()
+  }, [fetchPostDetail, fetchComments])
+
+  // 评论区用户昵称和头像拉取
+  useEffect(() => {
     if (comments.length > 0) {
-      const uidSet = new Set(comments.map((c) => c.user_id).filter(Boolean))
-      const ids = [...uidSet]
-      fetchCommentUserNames(ids)
-      fetchCommentUserAvatars(ids)
+      const userIds = [...new Set(comments.map(c => c.user_id).filter(Boolean))]
+      fetchCommentUserNames(userIds)
+      fetchCommentUserAvatars(userIds)
     }
   }, [comments])
-
-  // ──────────────── 交互 handlers ────────────────
-  const handleBack = () => navigate(-1)
-
+  const handleBack = () => {
+    navigate(-1)
+  }
   const handleLike = async () => {
-    if (!currentUserId) {
-      alert('请先登录～')
-      return
-    }
-
+    const currentUserId = getCurrentUserId()
+    const originalLiked = liked
+    const originalLikeCount = likeCount
+    
     try {
-      if (liked) {
-        // 取消点赞
-        await postsAPI.unlikePost(id, currentUserId)
+      // 先乐观更新UI，提供即时反馈
+      const newLiked = !liked
+      setLiked(newLiked)
+      setLikeCount(prev => newLiked ? prev + 1 : prev - 1)
+      
+      // 调用后端API
+      if (newLiked) {
+        await searchAPI.likePost(id, currentUserId)
       } else {
-        // 点赞
-        await postsAPI.likePost(id, currentUserId)
+        await searchAPI.unlikePost(id, currentUserId)
       }
-
-      // —— 关键：操作成功后重新拉一次帖子详情（里面会 setLikeCount） —— 
-      await fetchPostDetail()
-
-      // —— 同步一下 liked 状态（可选，因为你直接用 fetchPostDetail 重置 likeCount，也可以重新查一下状态） —— 
-      const { liked: has } = await postsAPI.hasLikedPost(id, currentUserId)
-      setLiked(!!has)
-
-    } catch (err) {
-      console.error('点赞操作失败:', err)
+      
+      // API调用成功，状态已经更新，无需再次设置
+    } catch (error) {
+      console.error('点赞操作失败:', error)
+      
+      // 检查是否是可以忽略的错误
+      const errorMessage = error.message || error.toString()
+      const isIgnorableError = errorMessage.includes('already liked') || 
+                              errorMessage.includes('not liked yet') ||
+                              errorMessage.includes('already favorited') ||
+                              errorMessage.includes('not favorited yet')
+      
+      if (isIgnorableError) {
+        // 这些错误可以忽略，因为最终状态是正确的
+        console.log('忽略重复操作错误:', errorMessage)
+        return
+      }
+      
+      // 发生真正的错误时回滚到原始状态
+      setLiked(originalLiked)
+      setLikeCount(originalLikeCount)
+      alert('操作失败，请重试')
     }
   }
 
   const handleBookmark = () => {
     setBookmarked(!bookmarked)
-    // TODO: 调后端保存收藏状态
+    // 实际项目中这里应该调用后端API保存收藏状态
   }
 
   const handleShare = () => {
+    // 分享功能
     if (navigator.share) {
       navigator.share({
         title: post?.title,
@@ -207,27 +191,44 @@
         url: window.location.href,
       })
     } else {
+      // 复制链接到剪贴板
       navigator.clipboard.writeText(window.location.href)
       alert('链接已复制到剪贴板')
     }
   }
-
   const handleAddComment = async (e) => {
     e.preventDefault()
     if (!newComment.trim()) return
+
     try {
+      const currentUserId = getCurrentUserId()
       await searchAPI.addComment(id, currentUserId, newComment)
       setNewComment('')
-      fetchComments()
-    } catch (err) {
-      console.error('添加评论失败:', err)
+      fetchComments() // 刷新评论列表
+    } catch (error) {
+      console.error('添加评论失败:', error)
       alert('评论失败，请重试')
     }
   }
 
-  const handleFollowChange = (followed) => setIsFollowing(followed)
+  // 关注后刷新关注状态
+  const handleFollowChange = async (followed) => {
+    setIsFollowing(followed)
+    // 关注/取关后重新拉取一次关注状态，保证和数据库同步
+    if (post && post.user_id) {
+      try {
+        const userInfo = getUserInfo()
+        if (!userInfo?.id) return
+        const res = await postsAPI.getUserFollowing(userInfo.id)
+        if (Array.isArray(res)) {
+          setIsFollowing(res.some(u => u.id === post.user_id))
+        } else if (Array.isArray(res.following)) {
+          setIsFollowing(res.following.some(u => u.id === post.user_id))
+        }
+      } catch {}
+    }
+  }
 
-  // ──────────────── 渲染逻辑 ────────────────
   if (loading) {
     return (
       <div className="post-detail">
@@ -239,6 +240,7 @@
     )
   }
 
+  // 优化错误和不存在的判断逻辑
   if (error) {
     return (
       <div className="post-detail">
@@ -254,6 +256,7 @@
     )
   }
 
+  // 只有明确为 null 或 undefined 时才显示不存在
   if (post === null || post === undefined) {
     return (
       <div className="post-detail">
@@ -281,8 +284,8 @@
           <button onClick={handleShare} className="action-btn">
             <Share2 size={20} />
           </button>
-          <button
-            onClick={handleBookmark}
+          <button 
+            onClick={handleBookmark} 
             className={`action-btn ${bookmarked ? 'active' : ''}`}
           >
             <BookmarkPlus size={20} />
@@ -292,56 +295,31 @@
 
       {/* 主要内容区 */}
       <main className="post-content">
-        {/* 标题 */}
+        {/* 帖子标题 */}
         <h1 className="post-title">{post.title}</h1>
 
-        {/* 作者 & 元数据 */}
+        {/* 作者信息和元数据 */}
         <div className="post-meta">
           <div className="author-info">
             <div className="avatar">
-              {authorInfo?.avatar && authorInfo.avatar.startsWith('http') ? (
-                <img
-                  className="avatar"
-                  src={authorInfo.avatar}
-                  alt={
-                    authorInfo.username ||
-                    authorInfo.nickname ||
-                    post.author ||
-                    '用户'
-                  }
-                />
+              {authorInfo && authorInfo.avatar && authorInfo.avatar.startsWith('http') ? (
+                <img className="avatar" src={authorInfo.avatar} alt={authorInfo.username || authorInfo.nickname || post.author || '用户'} />
               ) : (
-                <img
-                  className="avatar"
-                  src={`https://i.pravatar.cc/40?img=${post.user_id}`}
-                  alt={
-                    authorInfo?.username ||
-                    authorInfo?.nickname ||
-                    post.author ||
-                    '用户'
-                  }
-                />
+                <img className="avatar" src={`https://i.pravatar.cc/40?img=${post.user_id}`} alt={authorInfo?.username || authorInfo?.nickname || post.author || '用户'} />
               )}
             </div>
             <div className="author-details">
-              <span className="author-name">
-                {authorInfo?.username ||
-                  authorInfo?.nickname ||
-                  post.author ||
-                  '匿名用户'}
-              </span>
+              <span className="author-name">{authorInfo?.username || authorInfo?.nickname || post.author || '匿名用户'}</span>
               <span className="post-date">
-                {post.created_at
-                  ? dayjs(post.created_at).format('YYYY-MM-DD HH:mm:ss')
-                  : '未知时间'}
+                {post.created_at ? dayjs(post.created_at).format('YYYY-MM-DD HH:mm:ss') : '未知时间'}
               </span>
-
+              {/* 关注按钮 */}
               {post.user_id && (
                 <FollowButton
                   userId={post.user_id}
                   isFollowing={isFollowing}
                   onFollowChange={handleFollowChange}
-                  style={{ marginLeft: 12 }}
+                  style={{marginLeft: 12}}
                 />
               )}
             </div>
@@ -359,40 +337,25 @@
         </div>
 
         {/* 标签 */}
-        {post.tags?.length > 0 && (
+        {post.tags && post.tags.length > 0 && (
           <div className="post-tags">
-            {post.tags.map((tag, idx) => (
-              <span key={idx} className="tag">
-                {tag}
-              </span>
+            {post.tags.map((tag, index) => (
+              <span key={index} className="tag">{tag}</span>
             ))}
           </div>
         )}
 
-        {/* 媒体 */}
+        {/* 帖子媒体（支持多图/多视频） */}
         {Array.isArray(post.media_urls) && post.media_urls.length > 0 && (
-          <div
-            className="post-media"
-            style={{
-              display: 'flex',
-              gap: 8,
-              marginBottom: 16,
-              flexWrap: 'wrap',
-            }}
-          >
+          <div className="post-media" style={{display:'flex',gap:8,marginBottom:16,flexWrap:'wrap'}}>
             {post.media_urls.map((url, idx) => (
               <MediaPreview
                 key={idx}
                 url={url}
-                alt={`媒体${idx + 1}`}
+                alt={`媒体${idx+1}`}
                 onClick={(mediaUrl) => {
-                  // 图片点击预览
-                  const lower = mediaUrl.toLowerCase()
-                  if (
-                    !lower.includes('video') &&
-                    !lower.endsWith('.mp4') &&
-                    !lower.endsWith('.webm')
-                  ) {
+                  // 对于图片，显示预览
+                  if (!mediaUrl.toLowerCase().includes('video') && !mediaUrl.includes('.mp4') && !mediaUrl.includes('.webm')) {
                     setPreviewImg(mediaUrl)
                   }
                 }}
@@ -403,42 +366,19 @@
             ))}
           </div>
         )}
+        {/* 大图预览弹窗 */}
         {previewImg && (
-          <div
-            className="img-preview-mask"
-            style={{
-              position: 'fixed',
-              zIndex: 9999,
-              top: 0,
-              left: 0,
-              right: 0,
-              bottom: 0,
-              background: 'rgba(0,0,0,0.7)',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-            }}
-            onClick={() => setPreviewImg(null)}
-          >
-            <img
-              src={previewImg}
-              alt="大图预览"
-              style={{
-                maxWidth: '90vw',
-                maxHeight: '90vh',
-                borderRadius: 12,
-                boxShadow: '0 4px 24px #0008',
-              }}
-            />
+          <div className="img-preview-mask" style={{position:'fixed',zIndex:9999,top:0,left:0,right:0,bottom:0,background:'rgba(0,0,0,0.7)',display:'flex',alignItems:'center',justifyContent:'center'}} onClick={()=>setPreviewImg(null)}>
+            <img src={previewImg} alt="大图预览" style={{maxWidth:'90vw',maxHeight:'90vh',borderRadius:12,boxShadow:'0 4px 24px #0008'}} />
           </div>
         )}
 
-        {/* 正文 */}
+        {/* 帖子正文 */}
         <div className="post-body">
           <p>{post.content}</p>
         </div>
 
-        {/* 分类 / 类型 */}
+        {/* 类别信息 */}
         {(post.category || post.type) && (
           <div className="post-category">
             {post.category && (
@@ -449,9 +389,7 @@
             )}
             {post.type && (
               <>
-                <span className="category-label" style={{ marginLeft: '1em' }}>
-                  类型：
-                </span>
+                <span className="category-label" style={{marginLeft: '1em'}}>类型：</span>
                 <span className="category-name">{post.type}</span>
               </>
             )}
@@ -461,7 +399,7 @@
         {/* 评论区 */}
         <div className="comments-section">
           <div className="comments-header">
-            <button
+            <button 
               onClick={() => setShowComments(!showComments)}
               className="comments-toggle"
             >
@@ -472,7 +410,7 @@
 
           {showComments && (
             <div className="comments-content">
-              {/* 新评论 */}
+              {/* 添加评论 */}
               <form onSubmit={handleAddComment} className="comment-form">
                 <textarea
                   value={newComment}
@@ -491,37 +429,20 @@
                 {comments.length === 0 ? (
                   <p className="no-comments">暂无评论</p>
                 ) : (
-                  comments.map((comment, idx) => (
-                    <div key={idx} className="comment-item">
+                  comments.map((comment, index) => (
+                    <div key={index} className="comment-item">
                       <div className="comment-author">
                         <div className="comment-avatar">
-                          <img
-                            className="avatar"
-                            src={
-                              commentUserAvatarMap[comment.user_id] ||
-                              `https://i.pravatar.cc/40?img=${comment.user_id}`
-                            }
-                            alt={
-                              commentUserMap[comment.user_id] ||
-                              comment.user_name ||
-                              '用户'
-                            }
-                          />
+                          <img className="avatar" src={commentUserAvatarMap[comment.user_id] || `https://i.pravatar.cc/40?img=${comment.user_id}`} alt={commentUserMap[comment.user_id] || comment.user_name || '用户'} />
                         </div>
-                        <span className="comment-name">
-                          {commentUserMap[comment.user_id] ||
-                            comment.user_name ||
-                            '匿名用户'}
-                        </span>
+                        <span className="comment-name">{commentUserMap[comment.user_id] || comment.user_name || '匿名用户'}</span>
                         <span className="comment-time">
-                          {comment.create_time
-                            ? new Date(comment.create_time).toLocaleString(
-                                'zh-CN'
-                              )
-                            : ''}
+                          {comment.create_time ? new Date(comment.create_time).toLocaleString('zh-CN') : ''}
                         </span>
                       </div>
-                      <div className="comment-content">{comment.content}</div>
+                      <div className="comment-content">
+                        {comment.content}
+                      </div>
                     </div>
                   ))
                 )}
@@ -534,29 +455,29 @@
       {/* 底部操作栏 */}
       <footer className="post-footer">
         <div className="action-bar">
-          <button
-            onClick={handleLike}
+          <button 
+            onClick={handleLike} 
             className={`action-button ${liked ? 'liked' : ''}`}
           >
             <ThumbsUp size={20} />
             <span>{likeCount}</span>
           </button>
-
-          <button
+          
+          <button 
             onClick={() => setShowComments(!showComments)}
             className="action-button"
           >
             <MessageCircle size={20} />
             <span>评论</span>
           </button>
-
+          
           <button onClick={handleShare} className="action-button">
             <Share2 size={20} />
             <span>分享</span>
           </button>
-
-          <button
-            onClick={handleBookmark}
+          
+          <button 
+            onClick={handleBookmark} 
             className={`action-button ${bookmarked ? 'bookmarked' : ''}`}
           >
             <BookmarkPlus size={20} />
diff --git "a/\346\216\250\350\215\220\347\256\227\346\263\225\346\216\250\347\220\206\350\277\207\347\250\213\347\244\272\344\276\213.md" "b/\346\216\250\350\215\220\347\256\227\346\263\225\346\216\250\347\220\206\350\277\207\347\250\213\347\244\272\344\276\213.md"
new file mode 100644
index 0000000..ef8fcac
--- /dev/null
+++ "b/\346\216\250\350\215\220\347\256\227\346\263\225\346\216\250\347\220\206\350\277\207\347\250\213\347\244\272\344\276\213.md"
@@ -0,0 +1,118 @@
+# 推荐算法推理过程（基于实际数据库数据）
+
+## 一、标签推荐算法
+
+### 步骤1：查用户兴趣标签
+- 查表：`user_tags`、`tags`
+- SQL：
+  ```sql
+  SELECT t.name
+  FROM user_tags ut
+  JOIN tags t ON ut.tag_id = t.id
+  WHERE ut.user_id = 1;
+  ```
+- 结果：用户1的兴趣标签为“科幻”“动画”“美食”“旅行”“穿搭”
+
+### 步骤2：查这些标签下的所有帖子
+- 查表：`post_tags`、`posts`、`tags`
+- SQL：
+  ```sql
+  SELECT p.id, p.title
+  FROM post_tags pt
+  JOIN posts p ON pt.post_id = p.id
+  JOIN tags t ON pt.tag_id = t.id
+  WHERE t.name IN ('科幻', '动画', '美食', '旅行', '穿搭')
+    AND p.status = 'published'
+    AND p.user_id <> 1;
+  ```
+- 结果：id=3（功夫熊猫）、id=25（Fifth Post）、id=29（Ninth Post）
+
+### 步骤3：查用户已互动过的帖子
+- 查表：`behaviors`
+- SQL：
+  ```sql
+  SELECT post_id FROM behaviors WHERE user_id = 1;
+  ```
+- 结果：1、2、3、21
+
+### 步骤4：排除已看过的内容，得到最终推荐
+- 查表：`post_tags`、`posts`、`tags`
+- SQL：
+  ```sql
+  SELECT DISTINCT p.id, p.title
+  FROM post_tags pt
+  JOIN posts p ON pt.post_id = p.id
+  JOIN tags t ON pt.tag_id = t.id
+  WHERE t.name IN ('科幻', '动画', '美食', '旅行', '穿搭')
+    AND p.status = 'published'
+    AND p.user_id <> 1
+    AND p.id NOT IN (1, 2, 3, 21);
+  ```
+- 结果：id=25（Fifth Post）、id=29（Ninth Post）
+
+### 结论
+最终标签推荐给用户1的内容是：Fifth Post、Ninth Post。
+
+---
+
+## 二、协同过滤推荐算法
+
+### 步骤1：查用户1有行为的帖子
+- 查表：`behaviors`
+- SQL：
+  ```sql
+  SELECT post_id FROM behaviors WHERE user_id = 1;
+  ```
+- 结果：1、2、3、21
+
+### 步骤2：查和用户1有重叠行为的其他用户
+- 查表：`behaviors`
+- SQL：
+  ```sql
+  SELECT DISTINCT b2.user_id, b2.post_id
+  FROM behaviors b1
+  JOIN behaviors b2 ON b1.post_id = b2.post_id
+  WHERE b1.user_id = 1 AND b2.user_id <> 1;
+  ```
+- 结果：用户2、3、4、5、33、36、38、39、43等
+
+### 步骤3：查这些相似用户还看过但用户1没看过的帖子
+- 查表：`behaviors`
+- SQL：
+  ```sql
+  SELECT DISTINCT post_id
+  FROM behaviors
+  WHERE user_id IN (2, 3, 4, 5, 33, 36, 38, 39, 43)
+    AND post_id NOT IN (1, 2, 3, 21);
+  ```
+- 结果：29、334、336、338、339
+
+### 步骤4：查这些帖子的详情
+- 查表：`posts`
+- SQL：
+  ```sql
+  SELECT id, title
+  FROM posts
+  WHERE id IN (29, 334, 336, 338, 339)
+    AND status = 'published';
+  ```
+- 结果：
+
+| id  | title         |
+|-----|--------------|
+| 29  | Ninth Post   |
+| 334 | 测试草稿      |
+| 336 | 学生证背面    |
+| 338 | 论文截图1     |
+| 339 | api第二次作业 |
+
+### 结论
+最终协同过滤推荐给用户1的内容是：Ninth Post、测试草稿、学生证背面、论文截图1、api第二次作业。
+
+---
+
+## 总结
+- 标签推荐算法推荐给用户1的内容是：Fifth Post、Ninth Post
+- 协同过滤推荐算法推荐给用户1的内容是：Ninth Post、测试草稿、学生证背面、论文截图1、api第二次作业
+
+每一步都明确了查哪个表、查什么数据，推理过程完全基于你的实际数据库内容。
diff --git "a/\346\216\250\350\215\220\347\256\227\346\263\225\346\216\250\347\220\206\350\277\207\347\250\213\347\244\272\344\276\213.pdf" "b/\346\216\250\350\215\220\347\256\227\346\263\225\346\216\250\347\220\206\350\277\207\347\250\213\347\244\272\344\276\213.pdf"
new file mode 100644
index 0000000..654624f
--- /dev/null
+++ "b/\346\216\250\350\215\220\347\256\227\346\263\225\346\216\250\347\220\206\350\277\207\347\250\213\347\244\272\344\276\213.pdf"
Binary files differ