hexo-deployer-cos-cdn 插件安裝使用指南

本文來自 悟塵紀，獲取更新內容可查看原文： https://www.lixl.cn/2020/020936412.html

Hexo部署插件，支持將靜態博客發佈到騰訊雲、阿里雲對象存儲中，並同步刷新被更新文件的CDN緩存。

詳見博文：hexo-deployer-cos-cdn 插件安裝使用指南。按量付費，一般訪問量不高的話，體驗期過後一個月也花不了幾塊錢。

特點

1. 全站 CDN 加速，速度超快，成本幾乎爲零。
2. 支持同時使用阿里雲和騰訊雲對象存儲服務。
3. 支持將網站和圖片發佈到各自的 bucket 中。
4. 每次上傳時會對比本地與雲端文件MD5值，只發布變更內容。
5. 支持同步部署到到多個博客託管服務，如 COS + Github Pages
6. 支持將 Markdown 源文件中圖片路徑替換爲 CDN 地址，便於直接粘貼/導入到第三方平臺。
7. 支持自動清理遠程 bucket 中的多餘文件，默認不啓用。

理想的 Markdown 博文寫作及發佈體驗

1. Ctrl + v 一鍵粘貼包括多張圖片和文本組成的混合內容並實時預覽，內容編輯所見即所得。
2. hexo g -d 一鍵發佈到多個託管平臺（如Github+COS）。
3. 自建的博客平臺擁有超快的訪問速度且幾乎零成本。
4. 直接粘貼/導入 Markdown 博文到第三方平臺（如知乎、簡書、CSDN）。

推薦使用 Typora + 本插件 實現如上體驗。Typora 配置參照下圖：

經過以上配置以後，在 Typora 中編輯 MarkDown 文檔時，截圖後直接 Ctrl + v 即可粘貼並實時預覽。尤其是一鍵粘貼包括多張圖片及文本的混合內容，並保留原格式非常方便。hexo d 部署以後，網站及圖片會自動上傳到雲對象存儲中。

安裝

npm install hexo-deployer-cos-cdn --save

配置

最簡單配置

deploy:
  type: cos-cdn
  cloud: tencent
  bucket: blog-1234567890
  region: ap-shanghai
  secretId: AKIDIgxxxxxxxxxxxxxxxxxxxx0SepjX
  secretKey: qXPCbxxxxxxxxxxxxxxxxxxxxsJZfdR

如上配置，圖片和文件將發佈到 騰訊雲的 同一個 bucket 中，默認開啓CDN加速，CDN加速域名爲 _config.yml 中配置的 url，圖片上傳後，Markdown 源文件中圖片依然是相對路徑。

網站與圖片放在不同的bucket中

deploy:
  type: cos-cdn
  cloud: tencent
  bucket: blog-1234567890
  region: ap-shanghai
  secretId: AKIDIgxxxxxxxxxxxxxxxxxxxx0SepjX
  secretKey: qXPCbxxxxxxxxxxxxxxxxxxxxsJZfdR
  imageConfig:
    cloud: aliyun
    cdnUrl: https://pic.lixl.cn
    bucket: lxl80
    region: oss-cn-beijing
    folder: static
    cdnEnable: false
    deleteExtraFiles: false #謹慎開啓
    secretId: AKIDIgxxxxxxxxxxxxxxxxxxxx0SepjX
    secretKey: qXPCbxxxxxxxxxxxxxxxxxxxxsJZfdR

如上配置，文件將發佈到 騰訊雲 的 bucket 中，圖片發佈到阿里雲的 bucket 中。圖片使用單獨的 CDN 加速域名。圖片cdn沒有開啓CDN換新及刪除多餘文件功能。

免備案部署

deploy:
  - type: git
    repo: https://github.com/lxl80/blog.git
    branch: gh-pages
    ignore_hidden: false
  - type: cos-cdn
    cloud: tencent
    bucket: blog-1234567890
    region: ap-shanghai
    cdnEnable: true
    deleteExtraFiles: true
    updatePosts: true
    secretId: AKIDIgxxxxxxxxxxxxxxxxxxxx0SepjX
    secretKey: qXPCbxxxxxxxxxxxxxxxxxxxxsJZfdR
    imageConfig:
      cloud: aliyun
      cdnUrl: https://cdn.jsdelivr.net/gh/lxl80/blog@gh-pages/static
      bucket: lxl80
      region: oss-cn-beijing
      folder: static
      cdnEnable: false
      deleteExtraFiles: true #謹慎開啓
      secretId: AKIDIgxxxxxxxxxxxxxxxxxxxx0SepjX
      secretKey: qXPCbxxxxxxxxxxxxxxxxxxxxsJZfdR

如上配置，需要安裝 hexo-deployer-git 插件。會同步將網站發佈到 Github Pages 及 雲對象存儲 中；如果 bucket 中有多餘文件會刪除；圖片上傳成功後，會將 Markdown 源文件中圖片路徑替換爲 CDN 地址。

如果嫌 Github Pages 國內訪問導致html頁面加載太慢，可以通過 netlify 來提速。在 netlify 中基於 git 創建站點，關聯 github 倉庫，以後通過 hexo g -d一鍵部署時，netlify 中的內容也會自動更新。示例站點: https://netlify.lixl.cn/

也可以使用免費的 jsDelivr CDN 來加速，如上面示例的 cdnUrl 配置成了 jsDelivr CDN 加速地址，這樣配置的話，圖片在阿里雲OSS中只保存備份，用戶訪問的是基於免費的 jsDelivr CDN 來加速 Github 圖牀的效果，全球訪問速度都很快，還省去了佔網站流量大頭的圖片流量 CDN 加速成本。 詳情可參見博文：使用Typora + PicGo 圖牀 + jsDelivr CDN實現高效 Markdown 創作。

補充： jsDelivr 是唯一具有中國政府頒發的有效ICP許可證的全球公共CDN，其直接在中國大陸設有數百個節點。

參數說明

• type： 固定填: cos-cdn

• cloud： 指定雲服務商，目前支持阿里雲 aliyun 和騰訊雲 tencent

• bucket 和 region： 以騰訊云爲例，進入控制檯 - 對象存儲 - 存儲桶列表 頁面，存儲桶名稱即: bucket ，所屬地域代號即: region，參照下圖紅框圈住的部分:

• secretId 和 secretKey：以騰訊云爲例，進入控制檯 - 訪問管理 - 訪問祕鑰 - API祕鑰管理，參照下圖紅框圈住的部分:

• cdnEnable: 是否啓用CDN加速，默認爲 true，如果爲 false ，將不會刷新 CDN 緩存。

• deleteExtraFiles: 是否刪除雲端多餘文件(本地不包含的文件)，默認爲 false，請謹慎選擇。

• updatePosts：是否更新 Markdown 源文中的圖片地址爲CDN路徑。默認爲 false ，如果設置爲 true ，之後再次修改 imageConfig.cdnUrl時，需要手動將 Markdown 源文中的圖片地址批量替換爲相對路徑，否則不生效。

• imageConfig.cdnUrl： 用於存儲圖片的 bucket 綁定的 CDN 加速域名。對費用敏感的話，可以參考與其它部署插件共存的配置示例，採用 jsDelivr CDN 節省流量成本。

• imageConfig.folder：本地博客 hexo/source/ 目錄內，用戶存放本地圖片文件的目錄。

注意事項

1. 使用雲對象存儲及 CDN 服務，網站需要先備案。
2. 超出免費額度要付費，記得開啓防盜鏈。
3. 更新 CDN 緩存需要授權，如果使用子賬號，請同時賦予該賬號此權限。
4. 如果想將 markdown 源文直接導入/粘貼到第三方平臺，記得在圖片 CDN 防盜鏈配置中增加白名單。

License

MIT

參考

• hexo-deployer-cos-enhanced
• openapi-core-nodejs-sdk
• oss-js-sdk