2021-04-09 前后端加解密

實際中,一般是通過RSA加密AES的密鑰,傳輸?shù)浇邮辗?,接收方解密得到AES密鑰,然后發(fā)送方和接收方用AES密鑰來通信。

web端傳輸密文到服務(wù)器端

基于vue+ axios實現(xiàn)加解密

安裝依賴
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
      );
    }
    // 數(shù)據(jù)發(fā)送前處理
    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 => {
    // 處理響應(yīng)錯誤
    Promise.reject(error);
  }
);
service.interceptors.response.use(
  function(response) {
    if (response.config.headers.code === 1) {//解密
      response.data = Decrypt(response.data);
    }
    // 對響應(yīng)數(shù)據(jù)做點什么
    if (response.data.code !== 200) { //處理失敗
     
    }
    return response;
  },
  function(error) {
    // 處理響應(yīng)錯誤
    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("網(wǎng)絡(luò)連接錯誤,請稍后再試", 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;

參考

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容