VUE密码登陆加密RSA方案

RSA加密与解密


使用 公钥 加密的数据,利用 私钥 进行解密。

使用 私钥 加密的数据,利用 公钥 进行解密。

安装依赖


vue使用rsa加密的时候首先需要安装一个依赖,帮助我们实现加密操作。

npm install jsencrypt

安装完就可以用了,如果安装失败用 cnpm

使用


创建一个方法,就是使用我们的密码加密用的。

passwordEncryption(passwordUser) {

let publicKey = this.secretKey // 从后台获取公钥,这个保存一下,在这里用。

console.log('后台公钥---------> ', publicKey)

let encryptor = new JSEncrypt() // 新建JSEncrypt对象

encryptor.setPublicKey(publicKey) // 设置公钥

let passwordEncryp = encryptor.encrypt(passwordUser) // 对密码进行加密

最后

自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。

深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。

img

既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门!

如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!

由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
8191877)

由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!

### Vue 中实现 RSA 加密和解密的方法 #### 1. 环境准备与依赖安装 为了在 Vue 项目中实现 RSA加密功能,可以借助 `jsencrypt` 库来完成。以下是具体的准备工作: - **安装依赖** 对于基于 Vue2 或 Vue3 的项目,可以通过以下命令安装所需的库: ```bash npm install jsencrypt --save ``` - **全局引入(可选)** 如果希望在整个应用中都可以方便地调用加密工具,则可以在项目的入口文件中进行配置。例如,在 Vue2 的 `main.js` 文件中: ```javascript import Vue from 'vue'; import JSEncrypt from 'jsencrypt'; Vue.prototype.$encrypt = new JSEncrypt(); ``` 对于 TypeScript 支持的 Vue3 项目,也可以按照类似的逻辑设置全局变量。 --- #### 2. 前端 RSA 加密实现 前端主要负责使用公钥对数据进行加密处理。以下是具体实现方式: ```javascript // 导入 JSEncrypt 类 import JSEncrypt from 'jsencrypt'; function encryptData(publicKey, data) { const crypt = new JSEncrypt(); // 创建实例 crypt.setPublicKey(publicKey); // 设置公钥 return crypt.encrypt(data); // 执行加密并返回结果 } export default encryptData; ``` 上述函数接受两个参数:一个是后端提供的公钥字符串 `publicKey`,另一个是要加密的数据 `data`。最终会返回经过 Base64 编码的加密串[^2]。 需要注意的是,如果要加密的内容长度较长,可能需要分段加密以满足 RSA 的最大输入限制[^4]。 --- #### 3. 后端 Flask 实现 RSA 解密 后端部分通常由 Python 提供支持,这里以 Flask 框架为例展示如何对接收到的加密数据进行解密操作。 首先确保已安装必要的库: ```bash pip install pycryptodome ``` 接着编写如下代码片段用于解密: ```python from Crypto.PublicKey import RSA from Crypto.Cipher import PKCS1_v1_5 import base64 def decrypt_data(private_key, encrypted_data): rsakey = RSA.importKey(private_key.encode()) # 导入私钥 cipher = PKCS1_v1_5.new(rsakey) # 初始化解密对象 decrypted_text = cipher.decrypt(base64.b64decode(encrypted_data), None).decode('utf-8') return decrypted_text ``` 此函数接收两个参数——私钥字符串 `private_key` 和来自前端加密数据 `encrypted_data`,并通过指定算法完成解密过程[^1]。 --- #### 4. AES+RSA 混合加密方案简介 虽然单独使用 RSA 可以解决安全性需求,但由于其性能较低以及存在明文大小限制等问题,实际开发中更倾向于采用 AES-RSA 组合的方式。即先利用随机生成的对称秘钥对大数据量内容做快速加密,再把该临时秘钥本身交给 RSA 处理传输至服务端[^3]。 这种方式既兼顾效率又保障了通信链路中的隐私保护能力。 --- ### 注意事项 - 公钥/私钥应妥善保管,切勿暴露在外网环境中。 - 当涉及敏感信息时务必启用 HTTPS 协议防止中间人攻击。 - 若需兼容移动端设备或者老版本浏览器,请测试目标平台是否完全支持所选用的技术栈。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值