前言

最近筆記本掛了送去維修，耽誤了我的學習計劃，就先把月初的一點小技巧發出來充充數……話說，沒了筆記本的日子，看書反而更加認真了~ 
遵從我2016年10月時，定下的目標：於2017年開始要堅持寫部落格。於是，我在GithubPage上搞了個靜態部落格網站 https://zggdczfr.cn/ 。作為一個有個性並略有強迫症的程式猿，肯定要給自己的部落格弄個個人域名，再配上一把小小的綠鎖頭。 
騰訊雲專門為大學生推出了伺服器和個人域名的優惠政策，鑑於這個域名是去年申請的，雖然不是很有個人特色也只能勉強用著先。

準備

（一）為什麼要使用 HTTPS 協議？

• 雖然SSL並不是無懈可擊的，但是我們應該儘可能提高竊聽成本
• 加密通訊不應心存僥倖，所有連線都應被加密
• 福利： 使用了HTTPS之後，如果網站的訪客是從其他已經使用了HTTPS的網站上跳轉過來，你就能在Google Analytics中獲取更完整的來源資訊。

不過關於最後一點，我不得不吐槽一下”牆”，它導致 Google Analytics 的資訊延遲長達一天以上，最後我不得不退而選擇 Baidu Analytics。

（二）在Github上搭建 Hexo 主題部落格

關於這個我就不羅嗦了，網上一大堆教程，分享一篇非常詳細的部落格(裡面包括了GithubPage應用自定義域名) : https://xuanwo.org/2015/03/26/hexo-intor/

（三）CloudFlare 給自己的域名加個 s

首先，GitHub Pages不支援上傳SSL證書。 
CloudFlare 是一家CDN提供商，它提供了免費的https服務(但不是應用SSL證書)。實現模式就是，使用者到CDN伺服器的連線為https，而CDN伺服器到GithubPage伺服器的連線為http，就是在CDN伺服器那裡加上反向代理。

1. 註冊並登入CloudFlare，並將自己域名下的 name server 修改為 CloudFlare 的 name server。
2. 在 CloudFlare 的 DNS 設定域名匹配到自己的GithubPage(啟用動態DNS加速)。
3. 在 CloudFlare 的 Crypto 設定 SSL 為 Flexible(等待一定時間實現建立連線後，就可以通過https來訪問自己的 GithubPage )。
4. 在 CloudFlare 的 Page Rules 中設定路由規則。一般情況下，利用Always use https設定兩條規則，規則連結分別為http://域名/*與http://域名/(開啟https強制跳轉)。

（四）關於評論系統

如果使用國外的評論系統disqus，這個的確完美支援 https。但，所限於使用者限制，也只能捨棄。 
對於國內的評論系統，主要就是友言(有JS檔案支援不了HTTPS引用)，多說(這個預設屬性並不支援HTTPS但可以進行改造)。

對”多說”進行了解

使用”多說”有一個缺點，他們的伺服器不知道為何會偶爾性掛掉。

多說的評論框雖然提供了https連結，但是其中的一些頭像和表情還是http的。通過F12，我們可以發現多說的embed.js請求頭像和表情的時候用的是http協。但是，這兩個連結本身也支援https協議。 
先給個embed.js的官方下載連結 : https://static.duoshuo.com/embed.js

• 下載後的JS檔案是經過壓縮的，所以我們需要用 Sublime Text 來進行格式話，以方便我們閱讀。

修改頭像連結

經過漫長的Debug，我終於找到了頭像連結的相應位置。 
搜尋avatar_url找到頭像連結(展示其中部分程式碼)，：

        var Z = { userUrl: function(e) {
                    return e.url }, avatarUrl: function(e) {
                    return e.avatar_url || rt.data.default_avatar_url
                }, loginUrl: function(e, t) {

簡單的字串替換為”https”，將其修改為：

        var Z = { userUrl: function(e) {
                    return e.url }, avatarUrl: function(e) {
                    var s = e.avatar_url || rt.data.default_avatar_url
                    s=s.replace(/http:/g,'https:');
                    return s
                }, loginUrl: function(e, t) {

修改表情連結

經過Debug，發現傳送的屬性是meaasge，它的上一個屬性是s。最終查了好久之後終於發現了它的位置(這個沒有上一個明顯)，搜尋s = e.post就可以找到它的位置(注意等號旁邊的空格)。

            var t = "",
                s = e.post,
                i = e.options,
                r = s.author;

簡單的字串替換為”https”，將其修改為：

            var t = "",
                s = e.post,
                i = e.options,
                r = s.author;
                s.message = s.message.replace(/http:/g,"https:");

修改表情按鈕連結

替換embed.js的路徑

以Hexo主題icarus為例，在themes\icarus\layout\comment資料夾下找到多說的呼叫ejs檔案。我將上面修改過的JS檔案放到了主題的資源JS資料夾，然後在相應的ejs檔案中修改呼叫路徑即可。

    ds.async = true;
    ds.src = '/js/embed.js';
    ds.charset = 'UTF-8';

完美應用

利用hexo命令hexo g && hexo d，重新將靜態資源pull到Github上。歡迎大家去訪問一下我的個人部落格 https://www.zggdczfr.cn/ 。

（五）關於圖床的問題

https引用的圖片一直是略微麻煩的事情。

• 第一種，是將圖片放到Github上。但是，使用相對路徑引用的話，會出現跳轉頁面時一些圖片路徑會錯誤；使用絕對路徑引用的話，會出現重定向的問題，瀏覽器報302異常，使瀏覽器上的綠色小鎖頭不見了(不能容忍……)。

• 第二種，是將圖片放到七牛雲上面，不過註冊使用者每個月有流量限制，我擔心若訪問人數太多(雖然不大可能)會使圖片失效。

• 第三種，從知乎上找到了支援 https 的圖床，雖然不知道能使用多久(我現在也就是使用這種)。給個連結 : https://www.tuchuang001.com/

• 第四種，在自己的私人伺服器上搭一個(因為自己的騰訊雲伺服器要經常做一些測試，就不選擇放到上面了)。