web安全之vue中RSA加密实践

354 阅读3分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第15天,点击查看活动详情

前情提要

写这篇文章主要是所在公司被美国制裁,同时时不时的遭受来自美国等异域的网络攻击。然后杭州市重金聘请黑客团队协助查找各个公司的网站漏洞,并督促进行网络安全加固。
而我负责的其中一个项目也在安全加固之列。
目前是采用相对更安全的rsa非对称加密。

什么是对称加密

  • 概念:对称加密指的是加密和解密都使用同一套秘钥。
  • 方式:AES
  • 注意:base64是编码方式不是加密

什么是非对称加密

加密和解密使用的是两个不同的秘钥,这种算法叫非对称加密。
与对称加密不同的是非对称加密有两套秘钥,一套公钥,一套私钥。
在前端使用公钥加密。私钥存在后端,解密的时候使用。公钥可以解密私钥加密的数据,私钥也可以解密公钥加密的数据。
因为是非对称的,所以如果有心人拿到了公钥,那他是无法由此破解加密后的数据的。

非对称加密的注意事项

一般情况下非对称加密不用来直接加密要加密的内容,而是加密经过对称加密之后的内容。具体原因还没有找到,不过最显而易见的就是加密强度又有所增长。如果有知道的还请在评论区打出来,感激不尽...

RSA秘钥的生成方式

通过openssl生成

  • Mac内置了openSSL开源加密库,所以可以直接在终端上使用命令生成公钥和私钥。
  • Window可以利用git命令行工具生成公钥和私钥
    • 调出git bash
    • 输入命令:openssl genrsa -out private.pem 1024
      • 会在终端打开的位置生成一个private.pem的文件
      • 注意这条命令生成的私钥和公钥的长度是1024bit,同时可选2048,4096.但是秘钥越长,解密的时间也就越长
    • 输入命令:openssl rsa -in private.pem -pubout -out public.pem
      • 会在终端打开的位置生成一个public.pem的文件
      • 这条命令主要是根据私钥生成公钥
    • 至此公钥和私钥就生成完毕了。
    • 查看方式:
      • 可以使用文本编辑器查看。
      • 在mac终端中使用vim打开查看
      • 在win中的git命令行使用cat命令打开查看
还可以通过在线工具生成。

由于掘金的限制就不贴网址了,大家可以在百度上自行查找。

前端应用

  • 准备工作:在本地项目里安装npm包:jsencrypt(基于rsa加密的js库)。命令:npm/yarn i/add jsencrypt
  • 在要使用加密的文件中导入:import JSEncrypt from 'jsencrypt'
  • 具体使用-加密
const encrypt = new JSEncrypt(); // 创建加密对象实例
cosnt publicKey = '-----BEGIN PUBLIC KEY-----MAOJJIEFIAJSIDJFOEJVJ....'; // 注意不要有空格
encrypt.setPublicKey(publicKey); // 设置公钥
const pasd = encrypt.encrypt('要加密的内容');
  • 解密
const decrypt = new JSEncrypt(); 
const prikey = '-----BEGIN RSA PRIVATE KEY-----MI...'; // 注意不要有空格
decrypt.setPrivateKey(priKey)//设置秘钥
const uncrypted = decrypt.decrypt(pasd); // pasd是上面用公钥加密后的内容。