前言

在移动端App开发中,AES加密非常常用,本文主要讲解如何在React Native中封装自己的AES加密工具类及会遇到的坑。这里的AES加密是基于前端常用的加密库**crypto-js**。

安装crypto-js

使用NPM或者Yarn安装crypto-js

1
2
3
4
# NPM
npm install crypto-js
# Yarn
yarn add crypto-js

注意:使用crypto-js4.0.0及以上的版本会报找不到Crypto.js的错,这可能是新版本的Bug,需要在package.json中找到crypto-js并把版本号指定为^3.3.0(与3.3.0版本兼容,相当于3.X.X, 即>=3.3.0 < 4.0.0,不改变大版本号),然后重新执行npm install

1
"crypto-js": "^3.3.0",   //

创建加密工具类

新建AESTool.js文件,添加如下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import CryptoJS from 'crypto-js'

const key = CryptoJS.enc.Utf8.parse('abcdef0123456789');
const iv = CryptoJS.enc.Utf8.parse("0123456789abcdef");

export const AESTool = {

encrypt: (message) => {
let sendData = CryptoJS.enc.Utf8.parse(message);
let encrypted =CryptoJS.AES.encrypt(sendData,key,{
iv: iv,
mode:CryptoJS.mode.CBC,
padding:CryptoJS.pad.Pkcs7
});
return encrypted.toString(); //Base64字符串
},

decrypt: (message) => {
let decrypt = CryptoJS.AES.decrypt(message, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
return decrypt.toString(CryptoJS.enc.Utf8);
}

}

这里使用的是CBC加密模式,使用了Pkcs7补码方式。需要注意的是加密方法里传的明文、偏移量、密钥等参数都需要使用CryptoJS.enc.Utf8.parse()方法解析之后使用。

注意:这里CryptoJS加密后的字符串就是Base64编码的,不需要重复进行Base64编码。解密的时候也直接传Base64字符串即可。