Hbuilder开发app实战-识岁05-Crypto.js实现各种js加密算法

 

 

前言

 

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加密。

实现代码

由于代码比较多，我就不引入了，地址：shisui/qiao.js at master · uikoo9/shisui · GitHub，

这一长段代码都是为了实现七牛云生成uptoken的base64url安全编码，

加密的在这里：

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

这里才是正真使用到cryptjs的地方。

其他加密

其他的加密过程也是类似的，

首先引入你需要的js，分开引入，或者引入压缩后的js，

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

当然，前提是翻墙了。