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 相关文章推荐
JS下拉框内容左右移动效果的具体实现
Jul 10 Javascript
js实现俄罗斯方块小游戏分享
Jan 31 Javascript
JQuery 图片滚动轮播示例代码
Mar 24 Javascript
初识SmartJS - AOP三剑客
Jun 08 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
Feb 13 Javascript
jQuery实现的小图列表,大图展示效果幻灯片示例
Oct 25 Javascript
Jquery+Ajax+xml实现中国地区选择三级联动菜单效果(推荐)
Jun 09 jQuery
Vuejs实现购物车功能
Nov 05 Javascript
Vue服务器渲染Nuxt学习笔记
Jan 31 Javascript
keep-alive不能缓存多层级路由菜单问题解决
Mar 10 Javascript
分享一款超好用的JavaScript 打包压缩工具
Apr 26 Javascript
Jquery+AJAX实现无刷新上传并重命名文件操作示例【PHP后台接收】
May 29 jQuery
微信小程序 空白页重定向解决办法
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
POSIX 风格和兼容 Perl 风格两种正则表达式主要函数的类比(preg_match, preg_replace, ereg, ereg_replace)
2010/10/12 PHP
PHP中Date()时间日期函数的使用方法小结
2011/04/20 PHP
Ajax实时验证用户名/邮箱等是否已经存在的代码打包
2011/12/01 PHP
php对csv文件的读取,写入,输出下载操作详解
2013/08/10 PHP
Javascript中自动切换焦点实现代码
2012/12/15 Javascript
使用js对select动态添加和删除OPTION示例代码
2013/08/12 Javascript
javascript自启动函数的问题探讨
2013/10/05 Javascript
jquery UI Datepicker时间控件的使用及问题解决
2016/04/28 Javascript
JQuery异步加载PartialView的方法
2016/06/07 Javascript
JavaScript随机打乱数组顺序之随机洗牌算法
2016/08/02 Javascript
浅析Javascript ES6新增值比较函数Object.is
2016/08/24 Javascript
浅谈关于angularJs中使用$.ajax的注意点
2017/08/12 Javascript
vue项目中api接口管理总结
2018/04/20 Javascript
vue导出html、word和pdf的实现代码
2018/07/31 Javascript
从vue源码解析Vue.set()和this.$set()
2018/08/30 Javascript
JavaScript 空间坐标的使用
2020/08/19 Javascript
python实现系统状态监测和故障转移实例方法
2013/11/18 Python
python类继承与子类实例初始化用法分析
2015/04/17 Python
Flask框架的学习指南之开发环境搭建
2016/11/20 Python
python获取网页中所有图片并筛选指定分辨率的方法
2018/03/31 Python
对python3新增的byte类型详解
2018/12/04 Python
python简单鼠标自动点击某区域的实例
2019/06/25 Python
python模式 工厂模式原理及实例详解
2020/02/11 Python
python如何获得list或numpy数组中最大元素对应的索引
2020/11/16 Python
Python 可视化神器Plotly详解
2020/12/26 Python
CSS3盒子模型详解
2013/04/24 HTML / CSS
公关关系专员的自我评价分享
2013/11/20 职场文书
工程总经理工作职责
2013/12/09 职场文书
文字自荐书范文
2014/02/10 职场文书
计算机专业毕业生求职信
2014/04/30 职场文书
师范生自荐信模板
2014/05/28 职场文书
整顿机关作风心得体会
2014/09/10 职场文书
公司领导班子群众路线四风问题对照检查材料
2014/10/02 职场文书
领导批评与自我批评范文
2014/10/16 职场文书
离婚协议书范本(通用篇)
2014/11/30 职场文书
2015中学政教处工作总结
2015/07/22 职场文书