在vue中关于rsa加密踩到的坑

选来选去,最后选中的是jsencrypt

一、安装jsencrypt

npm i jsencrypt
复制代码

二、在main.js 引入 jsencrypt

import JsEncrypt from 'jsencrypt'
Vue.prototype.$jsEncrypt = JsEncrypt
复制代码

三、使用jsencrypt,我这里单独把它写在一个js里面,方便管理一些嘛
  目录结构


import Vue from 'vue'
import JsEncrypt from 'jsencrypt'

  Vue.prototype.encruption = function(obj,pubkey){
	var jse = new JsEncrypt(); // 新建JSEncrypt对象
	jse.setPublicKey(pubkey)   // 设置公钥
	return jse.encrypt(obj); // 对密码进行加密
}

复制代码

在设置公钥的时候,需要后端同学传过来的公钥(pubkey)进行加密,所以我就是在这里踩得坑呀,我把请求公钥的方法写在了上段的js里,导致了在进行加密的时候还没有获取到pubkey,所以每次传的私钥后端同学都解密不出来。
最后debug之后发现了这个问题,所以在页面加载时候把pubkey就先请求出来 然后在需要加密时候把pubkey直接当做参数传过来~然后就完美的解决了这个bug~
请求公钥时候的代码:

//请求公钥
   getPubKey(){
   	apiRsaKey({      //接口
	}).then(res =>{			
    	this.pubKey = res.data	
        })
  },
复制代码

调用encruption方法

this.encruption(obj,this.pubKey)
复制代码

你可能感兴趣的:(在vue中关于rsa加密踩到的坑)