Vue路由的query传参加密之AES对称加密

2,272 阅读1分钟

1.vue 传参的方式及区别

 1.query可以用name或者path来引入,params传参只能使用name来引入
 2.当你使用params方法传参的时候,需要在路由后面加参数名,否则刷新页面参数会丢失。原因是使用params传参时,参数是作为URL路径的一部分;而query传参时是拼接在url后面的参数,在刷新时不会丢失参数。

query传参

截屏2021-07-15 下午2.14.09.png

params传参

截屏2021-07-15 下午2.17.06.png

截屏2021-07-15 下午2.24.14.png

什么是对称加密

在加密和解密过程中使用同一个密钥的方式被称为对称加密

加密过程如下:

 明文 + 加密算法 + 私钥 => 密文  

解密过程如下:

 密文 + 解密算法 + 私钥 => 明文

3.如何在vue中实现加密参数

1.安装crypto-js

npm i crypto-js -save-dev
crypto-js是一个纯javascript 写的加密算法类库,我们可以借助它使用AES,DES,RC4等加密方式或者md5,SHA等哈希散列。

2.定义默认密钥和当前使用的密钥

截屏2021-07-15 下午3.10.57.png

3.定义加密算法

截屏2021-07-15 下午3.12.38.png

4.定义解密算法

截屏2021-07-15 下午5.35.01.png 5.query使用加密算法

截屏2021-07-15 下午3.17.12.png 6.调用解密算法,获取参数

截屏2021-07-15 下午3.20.05.png

验证参数是否加密,解密是否成功并且获取到数据

截屏2021-07-15 下午3.22.27.png

截屏2021-07-15 下午3.44.34.png