Das Frontend verschlüsselt und entschlüsselt über AES (ECB-, CBC-Modus)

Verschlüsselungsanforderungen

1. Während der Projektentwicklung werden aufgrund der Notwendigkeit, vertrauliche Informationen der Schnittstellenparameter zu verschlüsseln und zu übertragen, auch die von der Backend-Schnittstelle zurückgegebenen Parameter verschlüsselt, und zu diesem Zeitpunkt sind Verschlüsselungs- und Entschlüsselungsvorgänge erforderlich.
2. Dieser Artikel verwendet AES für die Verschlüsselung und Entschlüsselung. Der AES-Verschlüsselungsalgorithmus bietet fünf verschiedene Arbeitsmodi: CBC, ECB, CTR, CFB, OFB
3. Hier werden nur die CBC- und ECB-Verschlüsselung und -Entschlüsselung erläutert. Die Hauptunterschiede zwischen diesen beiden Verschlüsselungsmodi bei Verwendung im Frontend sind wie folgt:
   1. Bei einer grundlegenden Verschlüsselungsmethode wird der Chiffretext in Blöcke gleicher Länge (nicht genug zum Füllen) unterteilt, dann einzeln verschlüsselt und einzeln ausgegeben, um den Chiffretext zu bilden.
   2. In einem zyklischen Modus werden der Chiffretext der vorherigen Gruppe und der Klartext der aktuellen Gruppe vor der Verschlüsselung XOR-verknüpft oder verschlüsselt. Der Zweck besteht darin, die Schwierigkeit des Knackens zu erhöhen. (Es ist nicht einfach, aktiv anzugreifen, die Sicherheit ist besser als bei ECB und es ist der Standard von SSL und IPSec.)

AES-Verschlüsselung und -Entschlüsselung

Abhängigkeiten installieren

npm install crypto-js --save-dev

Kapselungsverschlüsselungs- und -entschlüsselungsmethode (ECB-Modus)

1. Kapseln Sie die folgende Methode und nennen Sie die Datei aes.js

   // 引入
   import CryptoJS from 'crypto-js'
   
   // 密钥
   const AES_KEY = '****************' // 后端提供
   
   // 加密
   export function encrypt ({
          
           word }) {
         
         
     const key = CryptoJS.enc.Utf8.parse(AES_KEY)
     const srcs = CryptoJS.enc.Utf8.parse(word)
     const encrypted = CryptoJS.AES.encrypt(srcs, key, {
         
         
       mode: CryptoJS.mode.ECB,
       padding: CryptoJS.pad.Pkcs7
     })
     return encrypted.toString()
   }
   
   // 解密
   export function decrypt ({
          
           word }) {
         
         
     var key = CryptoJS.enc.Utf8.parse(AES_KEY)
     var decrypt = CryptoJS.AES.decrypt(word, key, {
         
         
       mode: CryptoJS.mode.ECB,
       padding: CryptoJS.pad.Pkcs7
     })
     return CryptoJS.enc.Utf8.stringify(decrypt).toString()
   }
   

2. verwenden

   // 引入aes.js，注意文件路径不要出错
   import {
         
          encrypt, decrypt } from './aes'
   
   // data：需要加密的数据
   // encryptData：加密后的密文
   // 若有需要则将js对象转换为字符串后进行加密：JSON.stringify(data)
   const encryptData = encrypt({
         
          word: JSON.stringify(data) })
   
   // data：需要解密的密文
   // decryptData：解密后的数据
   // 若解密结果为json字符串，则可以通过JSON.parse()方法将解密结果转化为json对象
   const decryptData = decrypt({
         
          word: data}) 
   

Kapselungsverschlüsselungs- und -entschlüsselungsmethode (CBC-Modus)

1. Kapseln Sie die folgende Methode und nennen Sie die Datei aes.js

   // 引入
   import CryptoJS from 'crypto-js'
   
   // 密钥
   const AES_KEY = '****************' // 后端提供
   // 初始化向量
   const IV = '****************' // 后端提供
   
   //加密方法
   export function encrypt( word ) {
         
         
   	let key = CryptoJS.enc.Utf8.parse(AES_KEY)
   	let iv = CryptoJS.enc.Utf8.parse(IV)
   	let srcs = CryptoJS.enc.Utf8.parse(word)
   
   	let encrypted = CryptoJS.AES.encrypt(srcs, key, {
         
         
   		iv,
     		mode: CryptoJS.mode.CBC,
     		padding: CryptoJS.pad.ZeroPadding
   	});
   	return encrypted.toString();
   }
   
   //解密方法
   export function decrypt( word ) {
         
         
   	var key = CryptoJS.enc.Utf8.parse(AES_KEY)
   	let iv = CryptoJS.enc.Utf8.parse(IV)
   	
   	var decrypt = CryptoJS.AES.decrypt(word, key, {
         
         
     		iv,
     		mode: CryptoJS.mode.CBC,
    		padding: CryptoJS.pad.ZeroPadding
   	})
   	return decrypt.toString(CryptoJS.enc.Utf8).trim()
   }
   

   2. verwenden

   // 引入aes.js，注意文件路径不要出错
   import {
         
          encrypt, decrypt } from './aes'
   
   // data：需要加密的数据
   // encryptData：加密后的密文
   // 若有需要则将js对象转换为字符串后进行加密：JSON.stringify(data)
   const encryptData = encrypt(JSON.stringify(data))
   
   // data：需要解密的密文
   // decryptData：解密后的数据
   // 若解密结果为json字符串，则可以通过JSON.parse()方法将解密结果转化为json对象
   const decryptData = decrypt(data)