快捷導(dǎo)航

Vue中使用crypto-js AES對(duì)稱(chēng)加密算法實(shí)現(xiàn)加密解密

更新時(shí)間：2022年03月24日 09:08:44 作者：~疆

?在數(shù)字加密算法中，通過(guò)可劃分為對(duì)稱(chēng)加密和非對(duì)稱(chēng)加密，本文主要介紹了Vue中使用crypto-js AES對(duì)稱(chēng)加密算法實(shí)現(xiàn)加密解密，文中根據(jù)實(shí)例編碼詳細(xì)介紹的十分詳盡，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

含義：有兩個(gè)鑰匙，及公鑰（Public Key）和私鑰（Private Key）。公鑰和私鑰是成對(duì)的存在，如果對(duì)原文使用公鑰加密，則只能使用對(duì)應(yīng)的私鑰才能解密。通過(guò)私鑰經(jīng)過(guò)一系列算法是可以推導(dǎo)出公鑰的，但是無(wú)法通過(guò)公鑰反向推倒出私鑰，這個(gè)過(guò)程的單向的。

優(yōu)點(diǎn)：安全，即使密文被攔截、公鑰被獲取，但是無(wú)法獲取到私鑰，也就無(wú)法破譯密文。作為接收方，務(wù)必要保管好自己的密鑰。

缺點(diǎn)：加密算法及其復(fù)雜，安全性依賴(lài)算法與密鑰，而且加密和解密效率很低。

下載crypto-js

cnpm i -S crypto-js

局部引用

import CryptoJS from "crypto-js";

加密解密數(shù)據(jù)

前端CBC模式或者ECB模式下的填充方式 Pkcs7，對(duì)應(yīng)后端AES算法模式中的 PKCS5Padding 填充方式

AES算法的ECB模式加密-設(shè)置秘鑰

ECB(Electronic Code Book電子密碼本)模式

優(yōu)點(diǎn)：

簡(jiǎn)單；
有利于并行計(jì)算；
誤差不會(huì)被擴(kuò)散；

缺點(diǎn):

不能隱藏明文的模式
可能對(duì)明文進(jìn)行主動(dòng)攻擊

因此，此模式適于加密小消息。

秘鑰必須為16進(jìn)制

encryptData() {
      // 此處key為16進(jìn)制
      let key = '385f33cb91484b04a177828829081ab7';
      console.log('密鑰：', key);
      // key格式化處理
      key = CryptoJS.enc.Utf8.parse(key);
      // 加密內(nèi)容
      const polygonGeojson = {
        type: 'Feature',
        properties: {},
        geometry: {
          type: 'Polygon',
          coordinates: [
            [
              [106, 33],
              [108.03955078125, 32.2313896627376],
              [108.25927734375, 33.15594830078649],
              [106, 33]
            ]
          ]
        }
      };
      const content = JSON.stringify(polygonGeojson);
      console.log('加密前：', polygonGeojson);
      // 加密方法
      const encryptedContent = CryptoJS.AES.encrypt(content, key, {
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
      });
      const encStr = encryptedContent.ciphertext.toString();
      console.log('加密后：', encStr);
      // 解密方法
      const decryptedContent = CryptoJS.AES.decrypt(
        CryptoJS.format.Hex.parse(encStr),
        key,
        {
          mode: CryptoJS.mode.ECB,
          padding: CryptoJS.pad.Pkcs7
        }
      );
      console.log(
        '解密:',
        JSON.parse(CryptoJS.enc.Utf8.stringify(decryptedContent))
      );
    }

AES算法的CBC模式加密-設(shè)置秘鑰和偏移量

CBC(Cipher Block Chaining，加密塊鏈)模式

優(yōu)點(diǎn)：

不容易主動(dòng)攻擊
安全性好于ECB
適合傳輸長(zhǎng)度長(zhǎng)的報(bào)文,是SSL、IPSec的標(biāo)準(zhǔn)。

缺點(diǎn)：

不利于并行計(jì)算
誤差傳遞
需要初始化向量IV

CBC模式前、后端需要確定偏移量的值，并且保持一致，這樣才能確保后端解密成功。

    encryptData() {
      // 此處key為16進(jìn)制
      let key = '385f33cb91484b04a177828829081ab7';
      console.log('密鑰：', key);
      // key格式化處理
      key = CryptoJS.enc.Utf8.parse(key);
 
      // 偏移量長(zhǎng)度為16位, 注：偏移量需要與后端定義好，保證一致
      let iv_key = '37fa77f6a3b0462d';
      let iv = CryptoJS.enc.Utf8.parse(iv_key);
      // 加密內(nèi)容
      const polygonGeojson = {
        type: 'Feature',
        properties: {},
        geometry: {
          type: 'Polygon',
          coordinates: [
            [
              [106, 33],
              [108.03955078125, 32.2313896627376],
              [108.25927734375, 33.15594830078649],
              [106, 33]
            ]
          ]
        }
      };
      const content = JSON.stringify(polygonGeojson);
      console.log('加密前：', polygonGeojson);
      // 加密方法
      const encryptedContent = CryptoJS.AES.encrypt(content, key, {
        iv: iv,
        mode: CryptoJS.mode.ECB,
        padding: CryptoJS.pad.Pkcs7
      });
      const encStr = encryptedContent.ciphertext.toString();
      console.log('加密后：', encStr);
      // 解密方法
      const decryptedContent = CryptoJS.AES.decrypt(
        CryptoJS.format.Hex.parse(encStr),
        key,
        {
          iv: iv,
          mode: CryptoJS.mode.ECB,
          padding: CryptoJS.pad.Pkcs7
        }
      );
      console.log(
        '解密:',
        JSON.parse(CryptoJS.enc.Utf8.stringify(decryptedContent))
      );
    }

參考：

https://www.cnblogs.com/cndarren/p/15108270.html

https://blog.csdn.net/qq_40323256/article/details/116947888

到此這篇關(guān)于Vue中使用crypto-js AES對(duì)稱(chēng)加密算法實(shí)現(xiàn)加密解密的文章就介紹到這了,更多相關(guān)Vue crypto-js AES對(duì)稱(chēng)加密解密內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: