利用JavaScript加密文章內容

曾經使用過有名大站的人，或許會很喜歡它的文章密碼鎖定這個功能（至少我一些朋友不肯離開有名大站就是因為Blogger沒有這個功能），我曾經在Blogger Hacks的Wiki上看到一個「Encrypted blog posts」，這是一個利用JavaScript將文章內容以Advanced Encryption Standard (AES) 256 bit加密，就以我那低空飛過的密碼學的認識來說，安全性是足夠的，加密過後的文章會以不規則的英文顯示，當你想要看原始的文章內容，則需要輸入一串加密時所使用的Key（自行設定的字串），所以當你忘記key的內容，就無法看到原始的文章內容。

當初之所以沒有用這個Hack，是因為我覺得既然要在Blog上PO文又何必怕被人看呢？但是在跟朋友強力推薦Blogger時，卻又常常被以文章沒有保密的功能而加以回絕，昨天因RaRaYA的留言又讓我想起了這個Hack，於是決定將這個Hack的用法寫出來，順便看能不能打動我的朋友也加入Blogger的行列。

我在這裡有做了一篇Demo，建議各位先去看看，如果覺得這個效果不錯，再往下看這的Hack的做法。

1. 前面提過這Hack是利用JavaScript以AES 256 bit將文章加密，所以第一步就是要將加密/解密用的Javascript加入範本中，所以請將下列的程式碼加入範本的</head>之前：
<script src='http://vincentcheung.googlepages.com/blogjscrypt.js' language='JavaScript'></script>

2. 到這個網頁將文章加密；“key”的欄位可自行輸入，也可以按自動產生，但是key的內容請一定要留著，因為文章的解密一定要用，如果忘記key的內容，我想大概也沒有人能解出原來的文章內容。


3. “Plain Text”這個欄位輸入想要加密的文章內容，按下會在下方的“Cipher Text”產生加密過後的字串。


4. 而要在Blog內顯示的做法，就像我在Demo頁面有二種，一種是顯示加密過後的內容，一種是隱藏加密過後的內容，方法如下：
   方法一（Demo1）：
   <a href="javascript:Decrypt_text('unique_name');">Decrypt text（文章解密）</a>
<div id="unique_name">這裡輸入步驟3所產生的字串</div>
   
   方法二（Demo2）：
   <a href="javascript:Decrypt_text('unique_name', '這裡輸入步驟3所產生的字串');">Show encrypted text（顯示加密過後的字串）</a>
<div id="unique_name"></div>
   而當你要解密時，按下上面所產生的連結時，會出現一個字串輸入視窗，將步驟2的key輸入就會將字串解密為原來的文章，所以當你只想讓特定的人士觀看你的文章時，只需要將步驟2的“key”給那個人即可，而不知道“key”的人所看到的不過就是一堆不相關英文字串，這樣就能有文章保密的效果了。
   

• 在步驟4中“unique_name”代表的是Div的ID，請儘量取一個不會和別的Div重覆的名字。紅字部份一定要填入“Cipher Text”的內容，這是文章解密的依據。
• “key”的內容一定要備份。