这次的项目在登录时需要把密码进行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')
    }
  })
}

        以下图是页面的样子,以及加密后数据的样子:

登录界面
登录界面

             在调用登录界面后,我们可以在接口中看见,此时输入框中的密码已经被加密。

调接口传的值

 

Logo

前往低代码交流专区

更多推荐