評論功能完成,順便總結下開發評論的經驗

前端貓哥發表於2018-02-11

最近幾天一點都沒閒著,自從2月6日新版部落格釋出以來,一共5天時間寫了83個commits?,不過也收穫了19個star?,感謝各位老鐵刷的star哈哈?

這兩天最大的更新就是加了一個評論功能,包括後臺的評論管理,加上舊版部落格的評論,手擼過很多次評論了,也算有點心得,稍後就做一個詳細的總結,如果有想要手擼評論的朋友希望能幫到你,先放兩張圖看看效果?

前臺效果圖如下,截的手機版的,電腦的也差不多,還是簡約風:

後臺截圖如下,包括評論和評論回覆的管理,可以刪除和定位到前臺位置:

下面總結下開發評論系統的一些心得體會:

  1. 關於評論中的使用者認證
  2. 幾種評論的分析和選擇
  3. 評論系統的設計和資料結構

一、關於評論中的使用者認證

做評論就必須要考慮使用者認證的問題,舊版部落格我是首先做了一個登陸系統,然後登陸後評論就可以附帶個人資訊進行展示,不登入的話可以匿名評論但是不會有任何資訊

這次做評論我進行了很多的調整,首先我沒做登入系統(其實還是有,不過沒放出來?)因為考慮到絕大部分人懶的登入(比如我看吃雞直播的時候經常寧願看標清的都不想登陸2333),乾脆直接不要登入了,但是又想盡可能的知道留言人的資訊,於是就採用了常見的匿名留言附加自願輸入姓名,郵箱,個人網站等資訊的方式,郵箱可以用來給留言人發提醒郵件(當留言被回覆時)

二、幾種評論的分析和選擇

做評論之前一定要對評論的架構瞭解清楚,於是我分析了一些常見的評論系統,發現常見的評論分為兩種型別:

① 每個評論佔一樓,對這條評論的回覆和對回覆的回覆都放在本樓的右下側,以一個子模組的形式展現,典型例子:百度貼吧,簡書,示意圖如下:

優點:回覆集中顯示,看起來方便

缺點:樣式較複雜,每層樓的回覆多了還要加入分頁

② 不管評論還是回覆都完全一樣,一條一條的羅列下去,只是回覆通過提及或者引用的方式,示意圖如下:

優點:簡介,邏輯沒那麼複雜,樣式也統一

缺點:回覆不集中,如果想看例如兩個使用者完整的對話就比較困難

兩種方式各有優劣,其實都是不錯的方式,我選擇了第一種

三、評論系統的設計和資料結構

這裡以第一種評論進行設計和分析:

在第一種評論系統中,評論和回覆看似是分開的,以一個評論對應多個回覆這樣的關係關聯著,但是還是可以把資料統一,回覆也是評論,只不過有一個父節點,下面是我的評論表結構:

  • id (唯一自增鍵)
  • article_id(對應的文章 id)
  • parent_id(父節點 id)
  • target_name(用來儲存被回覆者的暱稱,如果有使用者系統則儲存 id)
  • content(回覆內容)
  • ...(其他評論相關的)

注意一個地方就行,每層樓裡的回覆不管是回覆誰的,父節點 id 都要儲存該層樓對應的評論(父節點)的 id,至於被回覆人的暱稱加一個欄位來儲存,然後前臺顯示的時候使用兩層迴圈就可以了,第一層迴圈顯示文章所有的評論,然後迴圈內套一個迴圈顯示該評論對應的所有回覆即可

手擼評論系統的過程中收穫還是很多的,沒嘗試過的朋友建議花點時間嘗試一下,建議不要用那種第三方評論系統,自己掌握不到資料,畢竟我們有程式設計師的驕傲?

— END —

原文連結:評論功能完成,順便總結下開發評論的經驗
GitHub:https://github.com/SadCreeper/laravel-blog-v2

相關文章