踩坑指南——VUE项目前端使用SM3国密加密
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
使用场景:在我的项目中,甲方要求系统登录时对密码进行加密后再传给后端,指定使用国密SM3,在这个过程中使用了很多种方法,最终总结出最简单的一种方法,如下:
操作步骤:1.先在项目中使用npm命令安装依赖
npm install --save sm-crypto
2.页面中部分代码
<template>
//密码框部分
<el-form-item prop="password">
<el-input
:key="passwordType"
v-model="loginForm.passwords"
:type="passwordType"
placeholder="密码"
name="password"
tabindex="2"
autocomplete="on"
@keyup.native="checkCapslock"
@blur="capsTooltip = false"
@keyup.enter.native="handleLogin"
/>
</el-form-item>
</template>
3.data数据部分
data(){
return{
loginForm: {
username: '',
passwords: '',
password: '',
},
}
}
4.加密方法及点击登录时 ,在表单验证成功后,调用登录接口前调用加密方法
// 加密方法
methods:{
doSM3() {
const sm3 = require('sm-crypto').sm3
this.loginForm.password = sm3(this.loginForm.passwords)
},
//点击登录
handleLogin(){
this.$refs.loginForm.validate((valid) => {
if (valid) {
doSM3()//调用加密方法
this.loginForm.password = doSM3(this.loginForm.passwords)
//调用接口部分,此处省略
} else {
return false
}
})
}
GitHub 加速计划 / vu / vue
207.54 K
33.66 K
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:2 个月前 )
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 4 个月前
e428d891
Updated Browser Compatibility reference. The previous currently returns HTTP 404. 5 个月前
更多推荐
已为社区贡献1条内容
所有评论(0)