• html前端的几种加密/解密方式


    一、base64加密

    前端用base64加密和解密的使用方法,只需要两个函数就可以了。一个是加密:window.btoa(),一个是解密:window.atob(),看例子:

    var str = "hello";
    var str64 = window.btoa("hello");
    console.log("字符串是:"+str);
    console.log("经base64编码后:"+str64);
    console.log("base64解码后:"+window.atob(str64));
    
    • 1
    • 2
    • 3
    • 4
    • 5

    二、MD5加密(不可逆)

    1.html使用md5加密

    //引入md5和jquery
    <script src="https://cdn.bootcdn.net/ajax/libs/blueimp-md5/2.18.0/js/md5.js">script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js">script>
    
    • 1
    • 2
    • 3
    //函数加密
    	authCode =10983131”
        pwd = md5(authCode);
        console.log('加密前的字符串',authCode) //加密前的字符串 10983131
        console.log('md5加密后',pwd); //md5加密后 d50235ff72ebb96d3732155ba7726fc6
    
    • 1
    • 2
    • 3
    • 4
    • 5

    2.MD5作为插件

    MD5.js是通过前台js加密的方式对用户信息,密码等私密信息进行加密处理的工具,也可称为插件。
    MD5共有6种加密方法:
    1, hex_md5(value)
    2, b64_md5(value)
    3, str_md5(value)
    4, hex_hmac_md5(key, data)
    5, b64_hmac_md5(key, data)
    6, str_hmac_md5(key, data)
    下载好了用script 标签引入使用

    var code = "123456";
    var username = "123456";
    var message = "123456";
    var str1 = hex_md5("123456");
    var str2 = b64_md5("123456");
    var str3 = str_md5("123456");
    var str4 = hex_hmac_md5(code,code);
    var str5 = b64_hmac_md5(username,username);
    var str6 = str_hmac_md5(message ,message );
    console.log(str1); // e10adc3949ba59abbe56e057f20f883e
    console.log(str2); // 4QrcOUm6Wau+VuBX8g+IPg
    console.log(str3); // áÜ9IºY«¾VàWò��>
    console.log(str4); // 30ce71a73bdd908c3955a90e8f7429ef
    console.log(str5); // MM5xpzvdkIw5VakOj3Qp7w
    console.log(str6); // 0Îq§;Ý��9U©��t)ï
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15

    三、sha1加密(不可逆)

    此处没找到sha1.js下载地址,所以在bootcdn中找在线文件到引入,需要的可自行从bootcdn中下载

    var sha1_1 = sha1("mosquito~");
    console.log(sha1_1);
    var sha1_2 = sha1("admin:1001");
    console.log(sha1_2);
    
    • 1
    • 2
    • 3
    • 4

    四、编码和解码字符串

    使用JS函数的escape()和unescape(),分别是编码和解码字符串

    var escape1 =escape("我的名字是:mosquito~");//编码
    console.log(escape1);
    var unescape1 = unescape(escape1); //解码
    console.log(unescape1);
    
    • 1
    • 2
    • 3
    • 4

    五、AES/DES加密解密

    下载crypto-js.js 引入使用

    <script src="https://cdn.bootcss.com/crypto-js/3.1.9-1/crypto-js.min.js">script>
    
    • 1
    var aseKey = "12345678" //秘钥必须为:8/16/32位
    var message = "80018000142";
    
    //加密
    var encrypt = CryptoJS.AES.encrypt(message, CryptoJS.enc.Utf8.parse(aseKey), {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
    }).toString();
    console.log(encrypt); //VKrZlqykem73x8/T2oCfCQ==
    
    //解密
    var decrypt = CryptoJS.AES.decrypt(encrypt, CryptoJS.enc.Utf8.parse(aseKey), {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
    }).toString(CryptoJS.enc.Utf8);
    console.log(decrypt); //80018000142
    //【注】:加密的时候必须转成字符串 使用toString。 解密的时候 必须使用utf8的格式
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
  • 相关阅读:
    MySQL:02-增删改查
    JSP out.print()和out.write()方法的不同之处
    DataStructure--Tree
    C++程序设计第十章课后习题答案——运算符重载练习
    漏刻有时数据可视化Echarts组件开发(40)pictorialBar象形柱图
    深入ReentrantLock
    【网络】传输层TCP/UDP,3次握手、4次挥手,超时重传,滑动窗口,流量控制,拥塞控制
    Jumperserver堡垒机管理服务器实战
    迁移学习
    Go 之 redis 处理
  • 原文地址:https://blog.csdn.net/TKP666/article/details/126410704