在VUE3项目中 axios 使用AES

axios 是一个基于 Promise 的 HTTP 客户端，可以用于浏览器和 Node.js。而 AES（Advanced Encryption Standard）是一种常用的对称加密算法，可以用来加密和解密数据。

在 VUE3 项目中使用 axios 和 AES 进行加密和解密的步骤如下：

1. 安装 axios 和 crypto-js：

npm install axios crypto-js

2. 在需要使用 axios 的组件或页面中引入 axios 和 crypto-js：

import axios from 'axios';
import CryptoJS from 'crypto-js';

3. 定义一个加密函数，用来对请求数据进行加密：

function encryptData(data, key) {
  const iv = CryptoJS.enc.Utf8.parse('1234567890123456'); // 初始化向量
  const encrypted = CryptoJS.AES.encrypt(data, key, {
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  });
  return encrypted.toString();
}

其中，`data` 是需要加密的数据，`key` 是加密密钥，`iv` 是初始化向量，`mode` 和 `padding` 是 AES 加密算法的模式和填充方式。

4. 在发送请求前，对请求数据进行加密：

const key = '1234567890123456'; // 加密密钥
const requestData = { name: 'John', age: 30 }; // 需要加密的数据
const encryptedData = encryptData(JSON.stringify(requestData), key); // 对数据进行加密
axios.post('/api/data', { data: encryptedData })
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

其中，`JSON.stringify(requestData)` 将请求数据转换成字符串，然后使用 `encryptData` 函数对其进行加密。

5. 定义一个解密函数，用来对响应数据进行解密：

function decryptData(data, key) {
  const iv = CryptoJS.enc.Utf8.parse('1234567890123456'); // 初始化向量
  const decrypted = CryptoJS.AES.decrypt(data, key, {
    iv: iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  });
  return decrypted.toString(CryptoJS.enc.Utf8);
}

其中，`data` 是需要解密的数据，`key` 是解密密钥，`iv` 是初始化向量，`mode` 和 `padding` 是 AES 解密算法的模式和填充方式。

6. 在接收响应后，对响应数据进行解密：

const key = '1234567890123456'; // 解密密钥
axios.get('/api/data')
  .then(response => {
    const decryptedData = decryptData(response.data, key); // 对响应数据进行解密
    console.log(JSON.parse(decryptedData));
  })
  .catch(error => {
    console.error(error);
  });

其中，`response.data` 是响应数据，使用 `decryptData` 函数对其进行解密，然后使用 `JSON.parse` 将解密后的字符串转换成对象。

注意：在使用 AES 加密算法时，加密密钥和解密密钥必须相同，否则无法正确解密数据。