JS 实现Base64编码与解码实例详解


Posted in Javascript onNovember 07, 2016

Js实现Base64编码与解码

Base64其实是一种简单的置换加密方式,但是BASE64的用处往往并不是为了防止信息泄露,而且为了方便传输,进过BASE64编码后的信息会比原始信息长,大概是4/3倍。

Base64是一种基于64个可打印字符来表示二进制数据的表示方法。由于2的6次方等于64,所以每6个比特为一个单元,对应某个可打印字符。

Base64常用于在通常处理文本数据的场合,表示、传输、存储一些二进制数据。包括MIME的email,email via MIME, 在XML中存储复杂数据。

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.加密、解密算法封装:

/** 
* 
* Base64 encode / decode 
* 
* @author haitao.tu 
* @date 2010-04-26 
* @email tuhaitao@foxmail.com 
* 
*/ 
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 相关文章推荐
setTimeout()与setInterval()方法区别介绍
Dec 24 Javascript
简介JavaScript中的setTime()方法的使用
Jun 11 Javascript
简介JavaScript中Math.LOG10E属性的使用
Jun 14 Javascript
jQuery实现非常实用漂亮的select下拉菜单选择效果
Nov 06 Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
Jul 04 Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
Sep 06 Javascript
Angular2从搭建环境到开发步骤详解
Oct 17 Javascript
模板视图和AngularJS之间冲突的解决方法
Nov 22 Javascript
webpack3之loader全解析
Oct 26 Javascript
vue双向绑定数据限制长度的方法
Nov 04 Javascript
vue中对象数组去重的实现
Feb 06 Javascript
解决vue页面渲染但dom没渲染的操作
Jul 27 Javascript
百度多文件异步上传控件webuploader基本用法解析
Nov 07 #Javascript
Angularjs的Controller间通信机制实例分析
Nov 07 #Javascript
jquery组件WebUploader文件上传用法详解
Oct 23 #Javascript
Vue.js 和 MVVM 的注意事项
Nov 07 #Javascript
JS用斜率判断鼠标进入DIV四个方向的方法
Nov 07 #Javascript
基于Phantomjs生成PDF的实现方法
Nov 07 #Javascript
扩展Bootstrap Tooltip插件使其可交互的方法
Nov 07 #Javascript
You might like
如何在PHP中使用Oracle数据库(5)
2006/10/09 PHP
3个PHP多维数组转为一维数组的方法实例
2014/03/13 PHP
浅谈PHP中output_buffering
2015/07/13 PHP
如何通过View::first使用Laravel Blade的动态模板详解
2017/09/21 PHP
Laravel中unique和exists验证规则的优化详解
2018/01/28 PHP
JavaScript TO HTML 转换
2006/06/26 Javascript
创建一个复制UBB软件信息的链接或按钮的js代码
2008/01/06 Javascript
javascript prototype 原型链
2009/03/12 Javascript
鼠标划过实现延迟加载并隐藏层的js代码
2013/10/11 Javascript
将数字转换成大写的人民币表达式的js函数
2014/09/21 Javascript
Nodejs极简入门教程(二):定时器
2014/10/25 NodeJs
javascript背景时钟实现方法
2015/06/18 Javascript
JavaScript地理位置信息API
2016/06/11 Javascript
微信小程序 下拉菜单的实现
2017/04/06 Javascript
nodejs socket实现的服务端和客户端功能示例
2017/06/02 NodeJs
vue实现的组件兄弟间通信功能示例
2018/12/04 Javascript
jQuery实现图片随机切换、抽奖功能(实例代码)
2019/10/23 jQuery
[04:28]DOTA2亚洲邀请赛小组赛第五日 TOP10精彩集锦
2015/02/03 DOTA
[10:21]2018DOTA2国际邀请赛寻真——Winstrike
2018/08/11 DOTA
[07:54]DOTA2-DPC中国联赛 正赛 iG vs VG 选手采访
2021/03/11 DOTA
Python3 正在毁灭 Python的原因分析
2014/11/28 Python
Python实现Const详解
2015/01/27 Python
python使用xslt提取网页数据的方法
2018/02/23 Python
Python如何发布程序的详细教程
2018/10/09 Python
对pandas将dataframe中某列按照条件赋值的实例讲解
2018/11/29 Python
Pytorch中的VGG实现修改最后一层FC
2020/01/15 Python
基于FME使用Python过程图解
2020/05/13 Python
python 利用toapi库自动生成api
2020/10/19 Python
canvas实现高阶贝塞尔曲线(N阶贝塞尔曲线生成器)
2018/01/10 HTML / CSS
金讯Java笔试题目
2013/06/18 面试题
什么是方法的重载
2013/06/24 面试题
大专学生推荐信范文
2013/11/19 职场文书
教师师德工作总结2015
2015/07/22 职场文书
导游词之澳门玫瑰圣母堂
2019/12/03 职场文书
使用Python+OpenCV进行卡类型及16位卡号数字的OCR功能
2021/08/30 Python
Win11怎么解除儿童账号限制?Win11解除微软儿童账号限制方法
2022/07/07 数码科技