如何將 Blogger / Github / 自架網站文章加密 ? 【第二版】

先前有介紹過如何將 Blogger, Github Pages 等自架網站的文章加密,方便了許多文章能夠加密、限制瀏覽者觀看。在第一版的程式碼,有使用者提出疑問,希望能夠用「一個密碼輸入框」來嘗試解密多個加密文章,而這個構想在原本第一版的程式是無法執行的。首先,我們必須感謝【Cotpear 作者群】「」提供第二版的程式碼。

1. 複製以下程式碼

<!--Design by Cotpear _Start-->
請輸入密碼,以顯示內容。
<input id="EPassword">
<button onclick="multiDecrypt($('#EPassword').val())">解密</button>
<script>
    var encryption = [
            "將您的密文貼至於此(1)",
            "將您的密文貼至於此(2)",
        ],
        canDeCrypt = 0;
    function multiDecrypt(pwd) {
        encryption.forEach((item, i) => {
            try {
                canDeCrypt = Decrypt(item, pwd)
            } catch (e) {
                if (canDeCrypt == 0) {
                    canDeCrypt = 0
                }
            }
        })
        if (canDeCrypt == 0) {
            alert("密碼錯誤")
        } else {
            //ok
            document.getElementById("result").innerHTML = canDeCrypt;
        }
    }
    function Decrypt(item, pwd) {
        return decodeURIComponent(
            CryptoJS.AES.decrypt(
                item, pwd
            ).toString(CryptoJS.enc.Utf8)
        )
    }
</script>
<br />
<br />
<div id="result"></div>
<!--Design by Cotpear _End-->

2. 貼至想要加密的文章編輯頁面(要在HTML編輯區貼上)

3. 打開 Cotpear 提供的 《GUI 加密文章 工具》。

4. 輸入要加密的「文章 HTML碼」 和想 設定的密碼,按下「建立密文」,再按下顯示出來的密文區塊,按下去後即複製。



5. 回到文章編輯頁面,把程式中的「將您的密文貼至於此(1)」文字,取代成你加密的密文。(如果沒有第二個密文,就將「"將您的密文貼至於此(2)",」文字直接刪除)

P.S. 如果有多個密文,請將

"將您的密文貼至於此(1)",
的下一行再加上
"將您的密文貼至於此(2)",

有更多密文的話繼續重複此操作。

此圖為示意圖


6. 按下「儲存」。

7. 打開 Blogger HTML 主題編輯器,在的上一行貼上以下指令。

<script src='https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.min.js'/>
<script src='https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/aes.min.js'/>


P.S. 如果你的網站中尚未新增 jQuery(不確定),請依照以下步驟加入:

  • 在 Blogger HTML 主題編輯器中(要點選編輯框內),按下鍵盤的 " Ctrl+F ",搜尋 "jquery"
  • 尋找是否已安裝過 jQuery
  • 若沒有安裝過,再搜尋 "</head>"
  • 在"</head>"的上一行貼上以下程式碼
    • <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
8. 儲存主題並發布文章

9. 完成!





繼續閱讀較新的文章 繼續閱讀較舊的文章 首頁

歡迎您「化讚為賞 - 回饋創作」

只要您隨手按個讚,我們就會得到實質性的支持!

2 則留言:

  1. 您好
    7. 打開 Blogger HTML 主題編輯器,在的上一行貼上以下指令。
    請問是在甚麼的上一行呢?

    回覆刪除
    回覆
    1. 您好,抱歉,是</head>,"<>"請改成半形<>

      刪除

歡迎您留言,如果有更進一步的問題,也可以 Messenger 聯絡我們喔