Detailed steps for using AES.js in Vue

Use of AES encryption

Data transmission encryption and decryption processing---AES.js

first step:

Install crypto-js dependency in vue

npm install crypto-js --save-dev

Step 2:

Create a new AES.js file in the static directory, for example:

Step 3:

Fill in the following code in AES.js

import CryptoJS from "crypto-js";
// npm install crypto-js --save-dev
//Randomly generate a specified number of 32-bit keys
export default {
  generatekey(num) {
    let library =
      "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
    let key = "";
    for (var i = 0; i < num; i++) {
      let randomPoz = Math.floor(Math.random() * library.length);
      key += library.substring(randomPoz, randomPoz + 1);
    }
    return key;
  },
  //encrypt(word, keyStr) {
    keyStr = keyStr ? keyStr : "CXMGNcYwTrtsadQmV935ONNXMUycpG1g"; //Judge whether ksy exists. If not, use the defined key
    var key = CryptoJS.enc.Utf8.parse(keyStr);
    var srcs = CryptoJS.enc.Utf8.parse(word);
    var encrypted = CryptoJS.AES.encrypt(srcs, key, {
      mode: CryptoJS.mode.ECB,
      padding: CryptoJS.pad.Pkcs7
    });
    return encrypted.toString();
  },
  //decryptiondecrypt(word, keyStr) {
    keyStr = keyStr ? keyStr : "CXMGNcYwTrtsadQmV935ONNXMUycpG1g";
    var key = CryptoJS.enc.Utf8.parse(keyStr);
    var decrypt = CryptoJS.AES.decrypt(word, key, {
      mode: CryptoJS.mode.ECB,
      padding: CryptoJS.pad.Pkcs7
    });
    return CryptoJS.enc.Utf8.stringify(decrypt).toString();
  }
};

Step 4:

Introduce where encryption is needed

import AES from "@/common/AES.js";

Step 5:

Call

//If it is an object/array, you need to convert it into a string by JSON.stringify first //Call the encryption method var encrypts = AES.encrypt(JSON.stringify(cars),keys);
//Call the decryption method var dess = JSON.parse(AES.decrypt(encrypts,keys));
console.log(encrypts)
console.log(encrypts.length)
console.log(dess)

This concludes this article on the detailed steps of using AES.js in Vue. For more relevant content about using AES.js in Vue, please search for previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!

You may also be interested in:

How to implement AES data encryption based on python3 and Vue
Using AES to implement password encryption and decryption in vue project (ECB and CBC modes)

<<: Detailed analysis of several situations in which MySQL indexes fail

>>: Docker nginx implements one host to deploy multiple sites