常见的加密算法基本分为这几类，
RSA加密：RSA加密算法是一种非对称加密算法。在公开密钥加密和电子商业中RSA被广泛使用。（这才是正经的加密算法）
非对称加密算法：非对称加密算法需要两个密钥：公开密钥（publickey:简称公钥）和私有密钥（privatekey:简称私钥）。公钥与私钥是一对，如果用公钥对数据进行加密，只有用对应的私钥才能解密。因为加密和解密使用的是两个不同的密钥，所以这种算法叫作非对称加密算法。
DES全称为Data Encryption Standard，即数据加密标准，是一种使用密钥加密的块算法
DES算法的入口参数有三个：Key、Data、Mode。其中Key为7个字节共56位，是DES算法的工作密钥；Data为8个字节64位，是要被加密或被解密的数据；Mode为DES的工作方式,有两种:加密或解密。
AES这个标准用来替代原先的DES
DES/AES我们合并在一起介绍其用法和特点
Base64是一种用64个字符来表示任意二进制数据的方法。base64是一种编码方式而不是加密算法。只是看上去像是加密而已（吓唬人）。
安装: npm install crypto-js --save在utils文件夹中新建secret.js文件，内容：
message: 需要加解密的文本
key: 加解密的秘钥
iv: 偏移量，最短8位数，ecb模式不需要此参数
在vue页面引入secret.js文件
请看demo， 用前请npm install crypto-js
创建一个js文件
import CryptoJS from 'crypto-js'
const encryptByDES = (message, key)=>{
let keyHex = CryptoJS.enc.Utf8.parse(key)
let encrypted = CryptoJS.DES.encrypt(message, keyHex, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.ZeroPadding
})
return encrypted.ciphertext.toString()
}
/**
* 对userId加密
* @param {String} userId
*/
export const encryption = (userId) => {
let _userId = userId.toString() || ''
let encryptedResult = encryptByDES(_userId, 'vZdyW1eW1cT9dbCBIbWntV2gjMuXGxPp')
return encryptedResult
}
html部分
import React, {Component} from 'react'
import CryptoJS from 'crypto-js'
import logo from './logo.svg'
import './App.css'
class App extends Component {
constructor(props){
super(props)
this.state={
userId: 123,
encryptedResult: ''
}
}
_handleChange = (event) => {
this.setState(() => ({
userId: event.target.value
}))
}
des = () => {
let data = this.encryptByDES('111', 'vZdyW1eW1cT9dbCBIbWntV2gjMuXGxPp')
this.setState(() => ({
encryptedResult: data
}))
}
encryptByDES = (message, key) => {
console.log(CryptoJS.pad)
let keyHex = CryptoJS.enc.Utf8.parse(key)
let encrypted = CryptoJS.DES.encrypt(message, keyHex, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.ZeroPadding
})
return encrypted.ciphertext.toString()
}
render() {
return (
<div className="App">
<input type="text" value={this.state.userId} onChange={this._handleChange}/>
<button type="button" onClick={this.des}>加密</button><br/>
<span>结果：{this.state.encryptedResult}</span>
</div>
)
}
}
export default App
