2021-04-09 前后端加解密

实际中，一般是通过RSA加密AES的密钥，传输到接收方，接收方解密得到AES密钥，然后发送方和接收方用AES密钥来通信。

web端传输密文到服务器端

基于vue+ axios实现加解密

安装依赖
1、RSA加解密(npm I jsencrypt)
2、AES加解密(npm i crypto-js)

import { Encrypt, Decrypt, CryptoUtil } from "@/utils/crypto";
import axios from "axios";

export const url = (() => {
  if(process.env.NODE_ENV !== "production") {
    let ip;
    ip = '**.**.**.**'; // 测试地址
    return `http://${ip}`;
  }
  return "";
})();

function getPort(data) {
  if (data.headers.code === 1) { //加密
    let str = JSON.stringify(data.data);
    data.data = Encrypt(str);
  }
  if (data.headers.type === 1) { //接口
    data.baseURL += (process.env.NODE_ENV === "production" ? "" : ":9000") + "/api/project";
  }
}

// 建立axios
const service = axios.create({
  baseURL: url,
  timeout: 10000 // request timeout
});

// 请求拦截
service.interceptors.request.use(
  config => {
    if (config.headers.code === 1) { //加密
      config.headers["X-Security-AesKeySecret"] = CryptoUtil.rsa.encrypt(
        CryptoUtil.aes.key
      );
    }
    // 数据发送前处理
    config.headers["X-Authorization"] = `Bearer ${localStorage.getItem(
      "token"
    )}`;
    config.headers["Content-Type"] = "application/json";
    config.headers["X-Router-Auth-Type"] = "pacust";
    config.headers["X-Router-Auth-Namespace"] = "web";
    getPort(config);
    return config;
  },
  error => {
    // 处理响应错误
    Promise.reject(error);
  }
);
service.interceptors.response.use(
  function(response) {
    if (response.config.headers.code === 1) {//解密
      response.data = Decrypt(response.data);
    }
    // 对响应数据做点什么
    if (response.data.code !== 200) { //处理失败
     
    }
    return response;
  },
  function(error) {
    // 处理响应错误
    if(error.response){
      if (error.response.config && error.response.config.headers.code === 1) {//解密
        error.response.data = Decrypt(error.response.data);
        console.log(error.response.data.data.errorMsg);
      }
   
    }
    if (
      error.code === "ECONNABORTED" &&
      error.message.indexOf("timeout") !== -1
    ) {
      message.error("请求超时,请稍后尝试刷新页面检查是否成功",3);
    }
    if (error.message.indexOf("Network Error") !== -1) {
      message.error("网络连接错误，请稍后再试", 3);
    }
    return Promise.reject(error);
  }
);
export default service;

@/utils/crypto文件

// 全局AES
import CryptoJS from "crypto-js";
import JSEncrypt from "jsencrypt";

//aes
const keys = "test.comsmartproject";
const ivs = "test.project-p0828xa";

//rsa
const publicKey ="略";

//aes加密
export function Encrypt(word) {
  let key = keys;
  let iv = ivs;

  key = CryptoJS.enc.Utf8.parse(key);
  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.Pkcs7
  });

  return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);
}

//aes解密
export function Decrypt(word) {
  let key = keys;
  let iv = ivs;

  key = CryptoJS.enc.Utf8.parse(key);
  iv = CryptoJS.enc.Utf8.parse(iv);
  let base64 = CryptoJS.enc.Base64.parse(word);
  let src = CryptoJS.enc.Base64.stringify(base64);

  let decrypt = CryptoJS.AES.decrypt(src, key, {
    iv,
    mode: CryptoJS.mode.CBC,
    padding: CryptoJS.pad.Pkcs7
  });

  let str = decrypt.toString(CryptoJS.enc.Utf8);

  let json = {};
  if (str !== "") {
    json = JSON.parse(str);
  }
  return json;
}

let CryptoUtil = {
  rsa: {
    encrypt: password => {
      let encryptor = new JSEncrypt();
      encryptor.setPublicKey(publicKey);
      let encrypted = encryptor.encrypt(password);
      return encrypted;
    }
  }
}

export default CryptoUtil;

参考