Vue登录密码验证MD5加密实践

更新时间：2026年04月14日 09:04:21 作者：Sunshine_Jian

文章主要描述MD5的特点、原理和使用方法,特点包括固定长度、容易计算、抗修改和强抗碰撞,使用方法包括安装js-md5、引入js文件、放到原型等,最后给出一个使用示例,用于密码验证

一、特点

1、压缩性：任意长度的数据，算出的MD5值长度都是固定的。
2、容易计算：从原数据计算出MD5值很容易。
3、抗修改性：对原数据进行任何改动，哪怕只修改1个字节，所得到的MD5值都有很大区别。
4、强抗碰撞：已知原数据和其MD5值，想找到一个具有相同MD5值的数据（即伪造数据）是非常困难的。

二、开始

1、安装 js-md5

npm install js-md5 --save

2、在 main.js 中引入 (在单组件引入后，直接使用：如：md5("123456"))

import md5 from 'js-md5';

3、放到原型上，方便使用

Vue.prototype.$md5 = md5;

三、使用

1、加密

let pwd = "123456";
let secret = "zheshimima";
console.log(this.$md5(pwd)); // e10adc3949ba59abbe56e057f20f883e // 第一次加密
let m1 = this.$md5(pwd) + secret;
console.log(this.$md5(m1)); // ffad1f7682ea8ef94698c103fb5b1675 // 第二次加密

tips：登录时密码验证

验证时，用加密后的密码与数据库里的密码进行比较；

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

vue监听路由变化时watch方法会执行多次的原因及解决
这篇文章主要介绍了vue监听路由变化时watch方法会执行多次的原因及解决，帮助大家更好的理解和学习使用vue框架，感兴趣的朋友可以了解下
2021-04-04
vue el-table实现递归嵌套的示例代码
本文主要介绍了vue el-table实现递归嵌套的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2022-08-08
Vue filter 过滤器、以及在table中的使用介绍
这篇文章主要介绍了Vue filter 过滤器、以及在table中的使用介绍，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2020-09-09
vue打包配置相对路径实现过程
文章主要讨论了在Vue项目中配置请求拦截器的`baseUrl`以及Vue Router的`base`属性的一致性问题,无论是使用hash模式还是history模式,相对路径都必须通过hash模式来确保正确性
2025-11-11
利用vue3+ts实现管理后台（增删改查）
这篇文章主要介绍了利用vue3+ts实现管理后台(增删改查),文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-10-10
Vue3实现自定义Input组件的示例详解
这篇文章主要为大家详细介绍了如何使用Vue3自定义实现一个类似el-input的组件,可以v-model双向绑定,感兴趣的小伙伴可以跟随小编一起学习一下
2024-03-03
Vue路由组件的缓存keep-alive和include属性的具体使用
：浏览器页面在进行切换时,原有的路由组件会被销毁,通过缓存可以保存被切换的路由组件,本文主要介绍了Vue路由组件的缓存keep-alive和include属性的具体使用,感兴趣的可以了解一下
2023-11-11
使用Element-UI的el-tabs组件,浏览器卡住了的问题及解决
这篇文章主要介绍了使用Element-UI的el-tabs组件,浏览器卡住了的问题及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2022-08-08
Vue3 style CSS 变量注入的实现
本文主要介绍了Vue3 style CSS 变量注入的实现，文中通过示例代码介绍的非常详细，需要的朋友们下面随着小编来一起学习学习吧
2021-07-07
vue3鼠标拖拽滑动效果实现demo
这篇文章主要为大家介绍了vue3鼠标拖拽滑动效果实现demo,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
2023-12-12