前端(Vue)Js实现MD5加密
写在前面
为防范风险,要保证传输给服务端的密码数据不是明文,所以决定通过前端对密码加密实现非明文密码传输。写这篇文章的目的不是解决疑难杂症,而是让大家可以随时找到可以解决问题的办法。
首先,希望友友们先跟我一起了解一下整个前后端的流程
- 用户注册时将加密后的密码发送给客户端储存在数据库里面
- 登陆的时候再将加密后的密码和数据库中存储的加密的密码相匹配
- 实现密码无明文传输登录
MD5加密没有很复杂,简单的几步就可以完成:
1. 导入依赖,这里使用的是crypto
2. 找到login(登录方法)
3. 创建加密后的变量替换我们的password
一、页面导入依赖
安装依赖
终端npm安装crypto
npm install crypto --save
在需要用到的文件中使用import…from…引入
import crypto from 'crypto'
调用其中的createHash()方法返回一个MD5实例对象
二、MD5加密实现
主要实现代码:
login() {
let md5 = crypto.createHash('md5')
md5.update(password)
const md5Password = md5.digest('hex')
const data = {
username,
md5Password,
code,
}
}
md5Password就是加密后的结果了
简要解析createHash()、md5.update()方法
createHash(‘md5’) 通过MD5加密的方式加密,返回一个实例对象
md5.update(你要加密的内容) 将你需要加密的内容加密
md5.digest(‘hex’) 返回的值是二进制 (ps:还有个md5.hexdigest()返回十六进制哦)
人有悲欢离合,月有阴晴圆缺。函数讲完了就要到了该告别的时候了!
三、给大家来个手动复述(记得要看)
以上就是整个实现过程,你学会了吗?
- let md5 = crypto.createHash(‘md5’)
- md5.update(password)
- md5.digest(‘hex’)
- 记得收藏不迷路 嘿嘿bye
完结