首先创建一条数据:
看看chrome的控制台,创建时传了哪些参数:
设置的password和confirm_password
为123456
,这里看到的是已经经过md5
加密处理过的数据。
接下来修改这条数据的密码为:123
修改成功,如下图:
下面就看看该功能的核心代码部分:
<template slot-scope="scope">
<el-button
size="small"
type="text"
@click="resetPassword(scope.row)"
>修改密码</el-button
>
</template>
<!-- 修改密码模态框 -->
<el-dialog
:visible.sync="showDetail"
:title="'修改密码'"
width="400px"
@closed="handlePasswordDialogClosed"
>
<render-form
ref="passwordForm"
:initForm="passwordForm"
:formModals="passwordModal"
:rules="passwordFormRules"
>
</render-form>
<span slot="footer" class="dialog_footer">
<el-button @click="showDetail = false">取消</el-button>
<el-button type="primary" @click="handleSavePassword">确定</el-button>
</span>
</el-dialog>
js:
<script>
import crypto from 'crypto'
export default {
data() {
return {
passwordForm: {
password: '',
confirm_password: ''
},
passwordFormRules: {
password: [{ required: true, message: '请输入密码' }],
confirm_password: [
{ required: true, validator: this.confirmResetHandle }
]
}。,
passwordModal: [
{
label: '新密码',
key: 'password',
inputType: 'password'
},
{
label: '确认密码',
key: 'confirm_password',
inputType: 'password'
}
],
showDetail: false,
}
},
methods: {
resetPassword(row) {
this.$set(this, 'passwordForm', {
id: row.id,
password: '',
confirm_password: ''
})
this.showDetail = true
},
handlePasswordDialogClosed() {
this.$refs.passwordForm.clearValidate()
},
handleSavePassword() {
this.$refs.passwordForm.validate(() => {
const md5 = crypto.createHash('md5')
const pwd = md5
.update(this.$refs.passwordForm.form.password)
.digest('hex')
this.$api.vest
.editPassword({
...this.$refs.passwordForm.form,
password: pwd,
confirm_password: pwd
})
.then(() => {
this.$message({
type: 'success',
message: '修改成功'
})
this.showDetail = false
this.$refs.vestGrid.fetchHandler()
})
})
},
// 两次密码校验
confirmResetHandle(rule, value, callback) {
if (value == '') {
callback(new Error('请再次输入密码'))
} else if (value !== this.$refs.passwordForm.form.password) {
callback(new Error('两次输入密码不一致'))
} else {
callback()
}
}
}
}
</script>
关于crypto
crypto
模块的目的是为了提供通用的加密和哈希算法。用纯JavaScript代码实现这些功能不是不可能,但速度会非常慢。Nodejs用C/C++实现这些算法后,通过cypto这个模块暴露为JavaScript接口,这样用起来方便,运行速度也快。
md5
是一种常用的哈希算法,用于给任意数据一个“签名”。这个签名通常用一个十六进制的字符串表示。
const md5 = crypto.createHash('md5')
const pwd = md5
.update(this.$refs.passwordForm.form.password)
.digest('hex')
update()
方法默认字符串编码为UTF-8
,也可以传入Buffer
。
如果要计算SHA1
,只需要把'md5'改成'sha1'
,就可以得到SHA1
的结果1f32b9c9932c02227819a4151feed43e131aca40
。
还可以使用更安全的sha256和sha512
。