前端base64、baseurl加解密和RSA加解密

　　由於項目最近要進行安全測試，前端的用戶和密碼都是明文數據傳送給后台那里，其實這樣很很不安全的，容易泄露個人信息和密碼。中間服務器的同事就提出，可以通過前端接收公鑰，利用公鑰對密碼進行加密，把加密過密碼字符串傳給中間服務器，中間服務器再利用私鑰對傳過來的密碼字符串進行解密，解密后的密碼用不可逆算法MD5進行加密存儲在數據庫里。這樣進行雙重加密，就不容易泄露個人信息和密碼。

一、   Base64/BaseUrl 加解密

　　中間服務器是用base64/baseUrl 加密過的token，把公鑰傳送給我，所以我要用base64/baseUrl 對token 進行解密，把公鑰取出來。

1、Base64 / BaseUrl

　　所謂Base64，就是選出64個字符作為一個基本字符集（A-Z，a-z，0-9，+，/，再加上作為墊字的"="，實際是65個字符），其它所有符號都轉換成這個字符集中的字符。

2、項目引入Base64.js文件

　　首先要把Base64.js文件引入，Base64.js文件如下：

//Base64.js文件
var Base64=
{  4     _keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",  5     encode:function(e){  6         var t="";  7         var n,r,i,s,o,u,a;  8         var f=0;  9         e=Base64._utf8_encode(e); 10         while(f<e.length){ 11             n=e.charCodeAt(f++); 12             r=e.charCodeAt(f++); 13             i=e.charCodeAt(f++); 14 s=n>>2; 15             o=(n&3)<<4|r>>4; 16             u=(r&15)<<2|i>>6; 17             a=i&63; 18             if(isNaN(r)){ 19                 u=a=64
            }else if(isNaN(i)){ 21                 a=64
 } 23     t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a) 24  } 25         return t 26  }, 27     decode:function(e){ 28         var t=""; 29         var n,r,i; 30         var s,o,u,a; 31         var f=0; 32         e=e.replace(/[^A-Za-z0-9+/=]/g,"");
        while(f<e.length){ 34             s=this._keyStr.indexOf(e.charAt(f++)); 35             o=this._keyStr.indexOf(e.charAt(f++)); 36             u=this._keyStr.indexOf(e.charAt(f++)); 37             a=this._keyStr.indexOf(e.charAt(f++)); 38             n=s<<2|o>>4; 39             r=(o&15)<<4|u>>2; 40             i=(u&3)<<6|a; 41             t=t+String.fromCharCode(n); 42             if(u!=64){ 43                 t=t+String.fromCharCode(r) 44  } 45             if(a!=64){ 46                 t=t+String.fromCharCode(i) 47  } 48  } 49         t=Base64._utf8_decode(t); 50         return t 51  }, 52 _utf8_encode:function(e){ 53         e=e.replace(/rn/g,"n"); 54         var t=""; 55         for(var n=0;n<e.length;n++){ 56             var r=e.charCodeAt(n); 57             if(r<128){ 58                 t+=String.fromCharCode(r) 59             }else if(r>127&&r<2048){ 60                 t+=String.fromCharCode(r>>6|192); 61                 t+=String.fromCharCode(r&63|128) 62             }else{ 63                 t+=String.fromCharCode(r>>12|224); 64                 t+=String.fromCharCode(r>>6&63|128); 65                 t+=String.fromCharCode(r&63|128) 66  } 67  } 68         return t 69  }, 70     _utf8_decode:function(e){ 71         var t=""; 72         var n=0; 73         var r=0,c1=0,c2=0; 74         while(n<e.length){ 75             r=e.charCodeAt(n); 76             if(r<128){ 77                 t+=String.fromCharCode(r); 78                 n++
            }else if(r>191&&r<224){ 80                 c2=e.charCodeAt(n+1); 81                 t+=String.fromCharCode((r&31)<<6|c2&63); 82                 n+=2
            }else{ 84                 c2=e.charCodeAt(n+1); 85                 c3=e.charCodeAt(n+2); 86                 t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63); 87                 n+=3
 } 89  } 90         return t 91  } 92 }; 93 
export {Base64}; //暴露模塊

3、Base64 加密解密

　　利用decode（）方法解密，encode（）方法加密，Vue項目引入Base64.js文件，如下：

//引入Base64.js文件，用Base64對公鑰解密
const self = this
import {Base64} from "../../../dist/static/js/Base64.js"
let base64Str = PUBLIC.AJAX_TOKEN.split('.')[1]; //取出加密后的公鑰
let user = JSON.parse(Base64.decode(base64Str)); //先base64解密，再把json數據轉化為js對象
self.pkey = user.secret; //公鑰
console.log(self.pkey);

二、RSA加密算法

　　RSA加密算法是一種非對稱加密算法。一般是客戶端初始化時訪問登錄服務時，服務端面動態生成一對RSA對，把公鑰傳給客戶端，客戶端拿到后，用戶輸入密碼后，點登錄時用公鑰加密返回給服務端，服務端用私鑰解密，這樣就完成了一次安全的數據傳送。

1、安裝jsencrypt

npm i jsencrypt –save

2、引入jsencrypt

　　在main.js 文件引入jsencrypt：

import JsEncrypt from 'jsencrypt'
Vue.prototype.$jsEncrypt = JsEncrypt

3、前端實例化

//實例化JSEncrypt
self.jse = new JSEncrypt(); 3 self.jse.setPublicKey('-----BEGIN PUBLIC KEY-----'+self.pkey+'-----END PUBLIC KEY-----');  //設置公鑰
self.jse.setPrivateKey('-----BEGIN RSA PRIVATE KEY-----'+self.privateKey+'-----END RSA PRIVATE KEY-----'); //設置私鑰

4、加密與解密

//RSA加密
let encryptVPwd = self.jse.encrypt(self.visitPassword); 3 console.log(encryptVPwd); 4 //RSA解密
let decryptVPwd = self.jse.decrypt(encryptVPwd); 6 console.log(decryptVPwd);

這樣可以把加密后的密碼傳給后台了。