前言

js加密，應該說做js開發的很少接觸到這一塊，因為很多時候都是做加密，很少有前端做加密的，

很榮幸我接觸過兩次，找到了crypto.js，很好的東西，可以實現各種js加密。

吐槽

吐槽下前端做加密，一般來說前端做加密這需求是很少的，極少的，

我卻碰到了兩次，一次是前後端分離，涉及到安全，所以資料傳輸需要加密，也就是ssl+3des+md5做加密，

一次就是識歲app，需要上傳到七牛雲，需要生成uptoken做加密，詳見上一節。

crypto.js

如果你不精通各種加密演算法，不精通js，那想要做出js加密是很難很難的，

幸好有crypto.js，這個js庫是專做加密的，各種加密演算法，

很高興的告訴你官網是：https://code.google.com/p/crypto-js/，

但是，被牆了，不翻牆是看不到的。

同樣很高興告訴你，我翻牆了，下載下來了，

下載下來後你會發現，有兩個資料夾：components，rollups，

前者是基礎元件，後者是加密演算法，也就是對基礎元件的合併壓縮。

rollups

這個資料夾下就是crypto.js所支援的各種加密演算法，

如果你只需要進行一種加密，那挺好，只需要在這裡找找，見頂部圖片，

然後將這個js引入就可以了。

components

如果不幸的，你需要做好幾種加密，那就不能這樣做了，或者說不建議這樣做，

因為rollups中的每個js都會封裝一些基礎js，如果你這樣做，意味著重複引入基礎js，我是不能忍。

那怎麼辦？來看看components資料夾吧，有這些：

js很多，但是你不需要害怕，你需要知道得很少。

core-min.js

這個是核心js，這個不管你用哪一個加密演算法都需要引入。

cipher-core-min.js

密碼js，這個如果你需要加密那就需要引入，如果只是做一些編碼之類的就不需要引入了。

回到正題，

如果要把crypto.js講清楚，我估計以我的水平得研究個一個月多，

幸好識歲app需要的只是base64編碼和sha1加密，

程式碼：

    <script type="text/javascript" src="@/js/lib/encode/core-min.js"></script>
    <script type="text/javascript" src="@/js/lib/encode/cipher-core-min.js"></script>
    <script type="text/javascript" src="@/js/lib/encode/enc-base64-min.js"></script>
    <script type="text/javascript" src="@/js/lib/encode/hmac-min.js"></script>
    <script type="text/javascript" src="@/js/lib/encode/sha1-min.js"></script>

通過實驗你會發現，你只需要這些js，就可以實現base64編碼和hmac-sha1加密。

實現程式碼

由於程式碼比較多，我就不引入了，地址：https://github.com/uikoo9/shisui/blob/master/%40/js/lib/qiao.js#L272，

這一長段程式碼都是為了實現七牛雲生成uptoken的base64url安全編碼，

加密的在這裡：

var hash = CryptoJS.HmacSHA1(encoded, qiao.qiniu.sk);
var encoded_signed = hash.toString(CryptoJS.enc.Base64);

這裡才是正真使用到cryptjs的地方。

其他加密

其他的加密過程也是類似的，

首先引入你需要的js，分開引入，或者引入壓縮後的js，

其次就是看文件和使用了，通常只需要一個方法搞定，

當然，前提是翻牆了。

更多教程：

Hbuilder開發App實戰1-識歲：http://uikoo9.com/book/detail/5

更多學習筆記：http://uikoo9.com/book