使用场景:在我的项目中,甲方要求系统登录时对密码进行加密后再传给后端,指定使用国密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 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐