Javascript实现base64的加密解密方法示例


Posted in Javascript onJune 27, 2017

这几天使用PHP向前端传值的时候,遇到一个问题,要将代码传过去赋值。如果使用urlencode()和urldecode()函数,就会出现js无法解码的情况,因为php和js的相关函数算法不一致。于是准备使用通用的base64加密解密。

base64 加密解密

下方是base64用javascript写出来的函数和方法。

//1.加密解密方法使用:
//1.加密 
var str = '124中文内容'; 
var base = new Base64(); 
var result = base.encode(str); 
//document.write(result); 
//2.解密 
var result2 = base.decode(result); 
document.write(result2); 
//2.加密、解密算法封装:
function Base64() { 
  // private property 
  _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="; 
  // public method for encoding 
  this.encode = function (input) { 
    var output = ""; 
    var chr1, chr2, chr3, enc1, enc2, enc3, enc4; 
    var i = 0; 
    input = _utf8_encode(input); 
    while (i < input.length) { 
      chr1 = input.charCodeAt(i++); 
      chr2 = input.charCodeAt(i++); 
      chr3 = input.charCodeAt(i++); 
      enc1 = chr1 >> 2; 
      enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); 
      enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); 
      enc4 = chr3 & 63; 
      if (isNaN(chr2)) { 
        enc3 = enc4 = 64; 
      } else if (isNaN(chr3)) { 
        enc4 = 64; 
      } 
      output = output + 
      _keyStr.charAt(enc1) + _keyStr.charAt(enc2) + 
      _keyStr.charAt(enc3) + _keyStr.charAt(enc4); 
    } 
    return output; 
  } 
  // public method for decoding 
  this.decode = function (input) { 
    var output = ""; 
    var chr1, chr2, chr3; 
    var enc1, enc2, enc3, enc4; 
    var i = 0; 
    input = input.replace(/[^A-Za-z0-9\+\/\=]/g, ""); 
    while (i < input.length) { 
      enc1 = _keyStr.indexOf(input.charAt(i++)); 
      enc2 = _keyStr.indexOf(input.charAt(i++)); 
      enc3 = _keyStr.indexOf(input.charAt(i++)); 
      enc4 = _keyStr.indexOf(input.charAt(i++)); 
      chr1 = (enc1 << 2) | (enc2 >> 4); 
      chr2 = ((enc2 & 15) << 4) | (enc3 >> 2); 
      chr3 = ((enc3 & 3) << 6) | enc4; 
      output = output + String.fromCharCode(chr1); 
      if (enc3 != 64) { 
        output = output + String.fromCharCode(chr2); 
      } 
      if (enc4 != 64) { 
        output = output + String.fromCharCode(chr3); 
      } 
    } 
    output = _utf8_decode(output); 
    return output; 
  } 
  // private method for UTF-8 encoding 
  _utf8_encode = function (string) { 
    string = string.replace(/\r\n/g,"\n"); 
    var utftext = ""; 
    for (var n = 0; n < string.length; n++) { 
      var c = string.charCodeAt(n); 
      if (c < 128) { 
        utftext += String.fromCharCode(c); 
      } else if((c > 127) && (c < 2048)) { 
        utftext += String.fromCharCode((c >> 6) | 192); 
        utftext += String.fromCharCode((c & 63) | 128); 
      } else { 
        utftext += String.fromCharCode((c >> 12) | 224); 
        utftext += String.fromCharCode(((c >> 6) & 63) | 128); 
        utftext += String.fromCharCode((c & 63) | 128); 
      } 
    } 
    return utftext; 
  } 
  // private method for UTF-8 decoding 
  _utf8_decode = function (utftext) { 
    var string = ""; 
    var i = 0; 
    var c = c1 = c2 = 0; 
    while ( i < utftext.length ) { 
      c = utftext.charCodeAt(i); 
      if (c < 128) { 
        string += String.fromCharCode(c); 
        i++; 
      } else if((c > 191) && (c < 224)) { 
        c2 = utftext.charCodeAt(i+1); 
        string += String.fromCharCode(((c & 31) << 6) | (c2 & 63)); 
        i += 2; 
      } else { 
        c2 = utftext.charCodeAt(i+1); 
        c3 = utftext.charCodeAt(i+2); 
        string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)); 
        i += 3; 
      } 
    } 
    return string; 
  } 
}

以上所述是小编给大家介绍的Javascript实现base64的加密解密方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
用javascript编写的第一人称射击游戏
Feb 25 Javascript
js getElementsByTagName的简写方式
Jun 27 Javascript
javascript面向对象包装类Class封装类库剖析
Jan 24 Javascript
window.open()详解及浏览器兼容性问题示例探讨
May 29 Javascript
js实现漂浮回顶部按钮实例
May 06 Javascript
用JavaScript实现页面重定向功能的教程
Jun 04 Javascript
js实现跨域的方法实例详解
Jun 24 Javascript
js+canvas绘制矩形的方法
Jan 28 Javascript
微信小程序 图片加载(本地,网路)实例详解
Mar 10 Javascript
node实现基于token的身份验证
Apr 09 Javascript
vue3.0 CLI - 3.2 路由的初级使用教程
Sep 20 Javascript
js获取对象,数组所有属性键值(key)和对应值(value)的方法示例
Jun 19 Javascript
微信小程序 空白页重定向解决办法
Jun 27 #Javascript
ionic 自定义弹框效果
Jun 27 #Javascript
js脚本编写简单刷票投票系统
Jun 27 #Javascript
详解Vue.js搭建路由报错 router.map is not a function
Jun 27 #Javascript
详解vue.js的事件处理器v-on:click
Jun 27 #Javascript
Vue.js学习记录之在元素与template中使用v-if指令实例
Jun 27 #Javascript
Vue.js常用指令之循环使用v-for指令教程
Jun 27 #Javascript
You might like
数据库查询记录php 多行多列显示
2009/08/15 PHP
深入分析php中接口与抽象类的区别
2013/06/08 PHP
PHP访问Google Search API的方法
2015/03/05 PHP
PHP策略模式定义与用法示例
2017/07/27 PHP
jquery.AutoComplete.js中文修正版(支持firefox)
2010/04/09 Javascript
一个简单的瀑布流效果(主体形式自写)
2013/05/27 Javascript
JavaScript实现当网页加载完成后执行指定函数的方法
2015/03/21 Javascript
详解Angular2中的编程对象Observable
2016/09/17 Javascript
vue自定义指令实现v-tap插件
2016/11/03 Javascript
JavaScript Base64 作为文件上传的实例代码解析
2017/02/14 Javascript
快速解决select2在bootstrap模态框中下拉框隐藏的问题
2018/08/10 Javascript
JavaScript链式调用实例浅析
2018/12/19 Javascript
Vue.js中的高级面试题及答案
2020/01/13 Javascript
[02:56]DOTA2矮人直升机 英雄基础教程
2013/11/26 DOTA
python复制文件代码实现
2013/12/23 Python
Python去除列表中重复元素的方法
2015/03/20 Python
详解Python的Django框架中inclusion_tag的使用
2015/07/21 Python
Python自动生产表情包
2017/03/17 Python
Python 专题二 条件语句和循环语句的基础知识
2017/03/19 Python
python opencv将图片转为灰度图的方法示例
2019/07/31 Python
Python Web框架之Django框架Model基础详解
2019/08/16 Python
python模拟实现斗地主发牌
2020/01/07 Python
详解Python 循环嵌套
2020/07/09 Python
关于css兼容性问题及一些常见问题汇总
2016/05/03 HTML / CSS
美国咖啡批发网站:Coffee.org
2017/06/29 全球购物
创业者是否需要商业计划书?
2014/02/07 职场文书
2014年党务公开实施方案
2014/02/27 职场文书
先进基层党组织事迹材料
2014/12/25 职场文书
期末考试复习计划
2015/01/19 职场文书
2015年汽车销售经理工作总结
2015/04/27 职场文书
边城读书笔记
2015/06/29 职场文书
只需要12页,掌握撰写一流商业计划书的技巧
2019/05/07 职场文书
Nginx+Tomcat实现负载均衡、动静分离的原理解析
2021/03/31 Servers
Python中tkinter的用户登录管理的实现
2021/04/22 Python
Python超简单容易上手的画图工具库推荐
2021/05/10 Python
python解析照片拍摄时间进行图片整理
2022/07/23 Python