前端参数加密解密，MD5加密

1.uniapp参数加密(传输给后端参数加密) 1.使用npm install crypto 下载加密所需文件 2.在项目根目录下创建一个utils文件夹，创建一个encryption.js文件写入如下代码块

let CryptoJS = require('crypto-js');
    // Crypto加密方法封装
 const aesUtil = {
     // 加密函數
     encrypt: (word, keyStr) => {
         if (word instanceof Object) {
             //JSON.stringify
             word = JSON.stringify(word)
         }
         var key = CryptoJS.enc.Utf8.parse(keyStr)
         var encryptedObj = CryptoJS.AES.encrypt(CryptoJS.enc.Utf8.parse(word), key, {
             mode: CryptoJS.mode.ECB,
             padding: CryptoJS.pad.Pkcs7,
         }, )
         return encryptedObj.toString()
     },
     // 解密函數
     decrypt: (word, keyStr) => {
         let key = CryptoJS.enc.Utf8.parse(keyStr)
         let decrypt = CryptoJS.AES.decrypt(word, key, {
             mode: CryptoJS.mode.ECB,
             padding: CryptoJS.pad.ZeroPadding,
         }, )
         let decString = CryptoJS.enc.Utf8.stringify(decrypt).toString();
         return decString
     }
 };
 module.exports={
     aesUtil
 }

3.使用加密参数功能函数

1.在需要使用加密的页面引入encryption.js文件 import Encry from ‘@/utils/encryption.js’ 2.在使用的页面引入与后端约定的key(非常重要，可以挂载全局变量)，example: const key=”cd10239350d94d639cba546a876c0daa”

//  初始化自定义参数
const key="cd10239350d94d639cba546a876c0daa";  // 前端与后端约定的共同协议密匙key
const postData={
  name:'小邱',
  age:21,
  height:175
};
console.log(Encry.aesUtil.encrypt(postData,key),'参数加密查看')
console.log(Encry.aesUtil.decrypt(postData,key),'参数解密查看')
uni.request({
  url:'fdfsdf',
  data: Encry.aesUtil.encrypt(postData, key), // 请求参数加密
  methods:'GET',
  header:{
     // 配置请求头信息
  },
  success(res){
    console.log(res)
  }
})

2.解密后端返回参数 1.在utils文件夹内创建一个WXBizDataCrypt.js文件，写入以下代码

var crypto = require('crypto')
function WXBizDataCrypt(appId, sessionKey) {
  this.appId = appId
  this.sessionKey = sessionKey
}
WXBizDataCrypt.prototype.decryptData = function (encryptedData, iv) {
  // base64 decode
  var sessionKey = new Buffer(this.sessionKey, 'base64')
  encryptedData = new Buffer(encryptedData, 'base64')
  iv = new Buffer(iv, 'base64')
  try {
     // 解密
    var decipher = crypto.createDecipheriv('aes-128-cbc', sessionKey, iv)
    // 设置自动 padding 为 true，删除填充补位
    decipher.setAutoPadding(true)
    var decoded = decipher.update(encryptedData, 'binary', 'utf8')
    decoded += decipher.final('utf8')
    decoded = JSON.parse(decoded)
  } catch (err) {
    throw new Error('Illegal Buffer')
  }
  if (decoded.watermark.appid !== this.appId) {
    throw new Error('Illegal Buffer')
  }
  return decoded
}
module.exports = WXBizDataCrypt

2.使用解密功能函数

1.在需要使用的页面引入该文件 import WXBizDataCrypt from ‘@/utils/WXBizDataCrypt.js’ 2.例如手机号授权的时候

// 1.首先通过uni.login获取到sessionKey并用变量保存
// 2.通过手机号授权获取到encryptedData和iv
// 3.接下来解密数据获取手机号
const data={
  iv:iv,
  encryptedData:encryptedData,
  sessionKey:sessionKey
},
// 使用解密获取数据 openId为小程序的openId,sessionKey是通过uni.login获取到的sessionkey;
let pc=new WXBizDataCrypt(openId,sesssionKey);
// 获取data的两个参数都是通过手机授权获取到的参数
const data=pc.decryptData(encryptedData,iv); 
console.log(data.phoneNumber,'获取到的手机号码')

3.前端使用md5加密 1.首先下载md5加密 打开dos命令窗口 npm install js-md5 -D 2.在main.js文件里引入并挂载全局 import Md5 from ‘js-md5’; // 引入 Vue.prototype.$md5=Md5; 3.在需要使用md5加密的页面直接使用 举个栗子 1.postData是请求参数 时间戳 signKey 预定的一个密钥 let result=$md5(JSON.stringify(postData)+(newDate().valueOf()siginKey) 2.result就是md5加密后的数据

4.原生HTML使用AES加密

<script src="https://cdn.bootcdn.net/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
<script type="text/javascript">
  var aseKey = "12345678"     //秘钥必须为：8/16/32位
var message = "13785624612";
//加密
var encrypt = CryptoJS.AES.encrypt(message, CryptoJS.enc.Utf8.parse(aseKey), {
  mode: CryptoJS.mode.ECB,
  padding: CryptoJS.pad.Pkcs7
}).toString();
console.log(encrypt); 
//解密
var decrypt = CryptoJS.AES.decrypt(encrypt, CryptoJS.enc.Utf8.parse(aseKey), {
  mode: CryptoJS.mode.ECB,
  padding: CryptoJS.pad.Pkcs7
}).toString(CryptoJS.enc.Utf8);
console.log(decrypt);    //13785624612
</script>

5.原色JS使用MD5加密生成验签sign

    <script src="https://cdn.bootcdn.net/ajax/libs/blueimp-md5/2.19.0/js/md5.js"></script>
  <script>
     // data 为原始参数对象  key为MD5验签的Key
     let sign=md5(JSON.stringify(data) + (new Date().valueOf()) + 'fdfdffsdfsf'),
  </script>