CF Workers配合Workers KV搭建免費博客集成Valine評論系統

大鳥大佬發掘出CF Workers配合Workers KV居然能搭建博客程序並集成Valine靜態博客評論系統。

官方網站https://www.cloudflare.com

開源項目https://github.com/gdtool/cloudflare-workers-blog

這是一個運行在CloudFlare Workers上的博客程序,使用CloudFlare KV作爲數據庫,無其它依賴,兼容靜態博客的速度,以及動態博客的靈活性。

主要特點

● 使用Workers提供的KV作爲數據庫;

● 使用CloudFlare緩存HTML來降低KV的讀寫;

● 所有HTML頁面均爲緩存,可達到靜態博客的速度;

● 使用KV作爲數據庫,可達到WordPress的靈活性;

● 後台使用Markdown語法,方便快捷;

● 一鍵發布(頁面重構+緩存清理)。

承載能力

● KV基本不存在瓶頸,因爲使用了緩存,讀寫很少;

● 唯一瓶頸是Workers的日訪問量10w,大約能承受2萬IP/日;

● 文章數:1GB存儲空間,發表幾萬篇文章應該沒有問題。

CloudFlare中文登陸https://dash.cloudflare.com/login

沒有CloudFlare賬號首先注冊賬號。

單擊右側的“Workers”進入界面後,在Workers KV中創建一個命名空間。如果使用CloudFlare的免費三級子域名,這裏命名空間名稱無所謂,例如空間命名爲:CF-Blog。建議命名爲:CFBLOG。

注意:綁定域名空間名稱一定要命名爲:CFBLOG,因爲後面的變量名稱必須是“CFBLOG”。

Workers KV

在CloudFlare網絡中存儲應用程序數據,並從Workers訪問鍵值對。

創建“CFBLOG”空間後,單擊“Workers”創建“Workers”。

代碼是CloudFlare-Workers-Blog的JS文件,複制index.JS代碼粘貼到紅色框內:

https://github.com/gdtool/cloudflare-workers-blog/blob/master/index.js

創建“Workers”可以先默認,之後再去編輯修改代碼內容。

或者修改代碼

1. 後台用戶名和後台密碼;

2. 域名、博客名稱;

3. 博客描述和博客關鍵字;

創建好“Workers”之後,現在去綁定Workers KV。

單擊“Settings”設置,點擊“Add Binding”添加綁定,在「Variable Name」變量名稱處必須填寫“CFBLOG”,選擇“KV NameSpace”KV命名空間,最後點擊“Save”保存。

演示https://www.365to.workers.dev

首先准備好自己的域名並接入到CloudFlare。

添加站點

填寫您已准備好自己的域名。

選擇CloudFlare的FREE套餐。如果您需要更高級的服務,可以勾選付費套餐。

直接點擊“Continue”繼續。

CloudFlare會自動獲取到的您原DNS上的解析信息。這一步獲取的解析信息是不全的,無需理會。因爲最後是要用CNAME方法接入,此處是用更改DNS的方法接入。直接點擊“Confirm”確認。

在官方的控制面板上,只能通過更改DNS來使用CloudFlare的解析服務。在CloudFlare刪除剛剛添加的域名,刪除是爲了使用CloudFlare的CNAME方式接入。在“Overview”頁面中,向下滾動至“Advanced Actions”,單擊“Remove Site From CloudFlare”,在“Remove Site”對話框中單擊“ Confirm”確認刪除在CloudFlare添加的域名。

笨牛網CloudFlare CDN防禦系統http://cdn.bnxb.com


注意:回源地址可先不填,接入後到解析管理處將默認生成的CNAME記錄改成A記錄(IP方式回源),也就是選擇A記錄方式把默認的example.bnxb.com替換成您服務器IP用于回源就OK了!在笨牛網設置www的解析,直接使用了A記錄解析,即CloudFlare的CDN在回源的時候,直接返回到服務器的IP。

這裏使用笨牛網CloudFlare CDN防禦系統。在笨牛網能看到分配給www.365tol.pp.ua的CloudFlare的CNAME接入記錄爲上圖紅框所示。

前往您域名使用的DNS商中將域名做CNAME記錄。

域名綁定

重新添加您已解析好的域名。

選擇CloudFlare的FREE套餐。如果您需要更高級的服務,可以勾選付費套餐。

單擊“+Add record”添加A記錄。IP地址直接使用笨牛網分配的IP地址,“代理狀態”只要代理開著即可。

域名绑定Workers

點擊域名,在“Overview”頁面中,再點頁面上方“Workers”,點擊“Add route”添加路由,域名後面是斜杠後面和星號:/*

獲取CloudFlare區域ID和API令牌

點擊域名,在“Overview”頁面往下拉,記錄下“Zone ID”區域ID,點擊“Get your API token”獲取您的API令牌,再點擊“API Tokens”API令牌,繼續點擊“Creata Tokens”創建令牌,選擇Edit zone DNS“Use template”使用模板,“Permissions”權限選擇「區域➠緩存清除➠清除」,“Zone Resources”區域資源選擇「包括➠特定區域➠您的域名」,點擊“Continue to summary”繼續顯示摘要,記錄下創建的API令牌。

集成Valine靜態博客評論系統

Valine誕生于2017年8月7日,是一款基于LeanCloud的快速、簡潔且高效的無後端評論系統。理論上支持但不限于靜態博客,目前已有Hexo、Jekyll、Typecho、Hugo、Ghost等博客程序在使用Valine。

注意:Valine分爲國內版和國際版,國內版需要實名,推薦使用國際版。

獲取評論用的AppID和Appkey

注冊LeanCloud賬號https://console.leancloud.app/login.html#/signup

賬號注冊完成後,需要先創建應用。單擊“創建應用”。

創建完成後,打開應用,點擊左邊的存儲,查看是否有Comment和Counter。如沒有則創建,權限設爲所有用戶。

创建Comment

創建Counter

點擊「設置」➠「安全中心」,將除了數據存儲的服務全部關閉。無需綁定域名(綁定Web安全域名,可以防止惡意調用)。

點擊「應用Keys」,獲取AppID和Appkey。

最後在“Workers”創建的命名空間「CFBLOG」裏放置評論代碼。

具體的放置可以參考文檔https://valine.js.org/configuration.html

需要設置<codeBeforHead>和<commentCode>具體如下:

"codeBeforHead":`<script src='//unpkg.com/valine/dist/Valine.min.js'></script>`,
"commentCode":`
    <div id="vcomment" class="comments-area"></div>
    <script>
        new Valine({
            el:'#vcomment',
            appId: '換成你自己的',
            appKey: '換成你自己的',
            avatar:'monsterid',
            placeholder:"評論可以一針見血..."
        })
    </script>
`,//評論區代碼

下面是大鳥大佬給出的具體集成Valine靜態博客評論系統布署代碼:

下載地址藍奏雲

因爲有緩存,您需要重新發一篇文章才會看到評論效果。

綁米演示https://www.365tol.pp.ua

未经允许不得转载:365t在線 » CF Workers配合Workers KV搭建免費博客集成Valine評論系統

评论列表

还木有评论 ,赶紧来一个!嘻嘻,:)

发表评论

访客的头像

Top