前端VUE3使用RSA加密向后端传输密码
前端VUE3使用RSA加密向后端传输密码
·
这次的项目在登录时需要把密码进行RSA加密传给后端,后端已经给了我公钥密钥,前端我需要利用这个密钥进行加密传给后端,此项目用的vue3的写法,以下是我的做法:
1.项目安装依赖:
npm install jsencrypt
2.在页面引入
import { JSEncrypt } from 'jsencrypt'
3.实际运用
// 登录
function submit() {
loading.value = true
// 新建一个JSEncrypt对象
let encryptor = new JSEncrypt()
// 设置公钥 (这是后端直接给我的,看你们项目情况是需要调接口获得,还是程序中直接写死)
let publicKey = 'KoZIhvcNAQwxOggaWPsYQJT+kpWZ/SpshZzmB=='
encryptor.setPublicKey(publicKey) // publicKey为公钥
// 加密数据
password.value = encryptor.encrypt(form.value.password)
//调用登录接口 (已经封装了axios)
login({
accountNumber: form.value.suAccount,
kaptcha: form.value.validation,
password: password.value,
sign: sign.value,
}).then((res) => {
loading.value = false
if (res.code === 200) {
message.success(res.msg)
// 存储token
Cookies.set('token', res.data.token)
router.push({ name: 'home' })
sessionStorage.removeItem('sign')
}
})
}
以下图是页面的样子,以及加密后数据的样子:
在调用登录界面后,我们可以在接口中看见,此时输入框中的密码已经被加密。
更多推荐
已为社区贡献1条内容
所有评论(0)