重寫Hexo豆瓣影評外掛

怪異收集者發表於2020-12-15
Hexo

不知道從什麼時候開始，習慣於在豆瓣找電影看，到了後來，就偶爾寫個電影觀後感，隨著看電影看的越來越多，可比較的東西就越來愈多，所以現在看完一部新電影，寫寫自己的感想就成了固定環節了，作為一種“動態”，能夠搬到部落格上與他人共享那是再好不過的了，找了一圈Hexo的外掛，發現都不怎麼好用，那麼索性就魔改個自己用的版本！

基於HEXO豆瓣外掛 hexo-douban 的二次開發插，強烈建議先試用原外掛，如果您覺得以下特性更能滿足您的需要，那麼再使用本外掛。

原外掛 hexo-douban 的不足：

  • 書影音、大部分人就想放影評
  • 樣式不好看，字型大小的一致性即顏色
  • 渲染全部觀影記錄，幾百部電影會導致有幾十頁翻頁，臃腫
  • 單純的構造豆瓣原頁面，在“已看”列表中，只會出現短評內容，長影評是另外的部分
  • 構造的頁面目錄較深，和部落格其他部分關聯度不夠
  • 主題相容性問題，valine部分的缺失
  • 移動端介面不適配/合適

對應的應對措施：

  • 砍掉多餘部分
  • 適當的美化了CSS
  • 設定拉取列表的長度控制
  • 魔改原有xpath解析邏輯，拉取長影評頁面內容，補全到“已看”列表
  • 改動原模板中樣式的位置，以便於無差別的插入到其他同原頁面，提升關聯度
  • 插入資原始檔和valine構建程式碼
  • 簡單的重寫了移動端樣式

本外掛的主要特性：

  • 原專案固有特性；
  • 重構模板頁面，支援移動適配；
  • 補全列表影評內容，支援短評和長影評（核心）；
  • 支援生成指定長度的列表（對於觀影數量較多的使用者）；
  • 樣式inline化，允許直接嵌入同源其他頁面；
    <div id="dbcontent"></div>
<script>$('#dbcontent').load('./movies/index.html .hexo-douban-item:nth-child(1)');</script>

注意：本外掛構建的頁面完全不保證相容IE等上古瀏覽器，推廣使用現代瀏覽器，人人有責。

第一步：安裝

# 如果您使用過原外掛請先解除安裝之
$ npm uninstall --save hexo-douban
$ npm install --save hexo-douban-list

第二步：配置

將下面的配置寫入站點的配置檔案 _config.yml 裡(不是主題的配置檔案).

douban:
  user: ID（數字或字幕|無需引號）
  builtin: true
  movie:
    title: '生成頁面的標題'
    quote: '生成頁面的內容的導語'
    length: 2
    valine_id: WbLE88qfAcz4hSI5
    valine_key: ycqjmtEfUxuxD
  timeout: 10000

注意：以上內容中務必確定 USER ID 的正確性！

  • user: 你的豆瓣ID.開啟豆瓣，登入賬戶，然後在右上角點選 “個人主頁” ，這時候位址列的URL大概是這樣：“https://www.douban.com/people/xxxxxx/” ，其中的"xxxxxx"就是你的個人ID了。
  • builtin: 是否將生成頁面的功能嵌入hexo s和hexo g中，預設嵌入（TRUE）即npm安裝後無需任何操作按原命令部署部落格即可生效。
  • title: 該頁面的標題。
  • quote: 寫在頁面開頭的一段話,支援html語法。
  • length: 預設值為2，非頁數，可以自由嘗試（建議取值:2-4）。
  • timeout: 爬取資料的超時時間，預設是 10000ms ,如果在使用時發現報了超時的錯(ETIMEOUT)可以把這個資料設定的大一點。

對於 valine_id 和 valine_key，主要針對的是Volantis主題（以及其他預設渲染評論區域的主題），如果您在測試時頁面沒有評論區域，則可以忽略這兩項，如果出現以下顯示則需要填寫此兩項。（這兩項是什麼？請移步Valine官方介紹）

使用

注意，通常大家都喜歡用hexo d來作為hexo deploy命令的簡化，但是當安裝了hexo douban之後，就不能用hexo d了，因為hexo douban跟hexo deploy的字首都是hexo d。

升級

使用 npm install hexo-douban-list --update --save 直接更新。

測試

執行 hexo clean && hexo generate && hexo server，之後訪問 localhost:4000/movies 即可訪問生成的影評頁面。

刪除（可補回來）的內容

相比較於原專案，取消或刪除了以下內容：

  • 去掉了書籍和音樂，單純針對電影
  • 去掉了影評頁跳轉的選單按鈕
  • 去掉了以上專案涉及的配置開關

異常

如果構建頁面為空或404，且日誌輸出為 INFO 0 movies have been loaded in xx ms，這時懷疑您的IP由於多次請求豆瓣的頁面而被豆瓣封禁了，一般第二天會解禁，使用代理或更改IP即可解決。

相關文章