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 相关文章推荐
jQuery选择器的工作原理和优化分析
Jul 25 Javascript
javascript判断两个IP地址是否在同一个网段的实现思路
Dec 13 Javascript
jquery获取tr并更改tr内容示例代码
Feb 13 Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
Jun 01 Javascript
JavaScript正则表达式中的ignoreCase属性使用详解
Jun 16 Javascript
JavaScript+html5 canvas绘制渐变区域完整实例
Jan 26 Javascript
JavaScript知识点总结(五)之Javascript中两个等于号(==)和三个等于号(===)的区别
May 31 Javascript
JavaScript表单焦点自动切换代码
Jul 24 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
Dec 26 Javascript
jQuery点击弹出层弹出模态框点击模态框消失代码分享
Jan 21 Javascript
Vue.js下拉菜单组件使用方法详解
Oct 19 Javascript
Vue router安装及使用方法解析
Dec 02 Vue.js
微信小程序 空白页重定向解决办法
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 array_push 数组函数
2009/12/26 PHP
thinkphp模板用法和内容输出实例
2014/11/28 PHP
PHP实现求连续子数组最大和问题2种解决方法
2017/12/26 PHP
js中方法重载如何实现?以及函数的参数问题
2013/08/01 Javascript
封装的jquery翻页滚动(示例代码)
2013/11/18 Javascript
jquery选择器使用详解
2014/04/08 Javascript
JS未跨域操作iframe里的DOM
2016/06/01 Javascript
javascript弹出窗口中增加确定取消按钮
2016/06/24 Javascript
bootstrap table复杂操作代码
2016/11/01 Javascript
用JavaScript实现让浏览器停止载入页面的方法
2017/01/19 Javascript
vue2.0中click点击当前li实现动态切换class
2017/06/21 Javascript
ES6新增的math,Number方法
2017/08/06 Javascript
利用node.js如何创建子进程详解
2017/12/09 Javascript
vue如何进行动画的封装
2018/09/26 Javascript
微信小程序分享海报生成的实现方法
2018/12/10 Javascript
Node.js的进程管理的深入理解
2019/01/09 Javascript
Nodejs监听日志文件的变化的过程解析
2019/08/04 NodeJs
在vue中利用全局路由钩子给url统一添加公共参数的例子
2019/11/01 Javascript
简单了解JavaScript arguement原理及作用
2020/05/28 Javascript
vue递归获取父元素的元素实例
2020/08/07 Javascript
Django项目中添加ldap登陆认证功能的实现
2019/04/04 Python
Python基于Serializer实现字段验证及序列化
2020/11/04 Python
VSCode 自定义html5模板的实现
2019/12/05 HTML / CSS
非凡女性奢华谦虚风格:The Modist
2017/10/28 全球购物
美国领先的在线邮轮旅游公司:CruiseDirect
2018/06/07 全球购物
JAVA中的关键字有什么特点
2014/03/07 面试题
北京华建集团SQL面试题
2014/06/03 面试题
EJB3.1都有哪些改进
2012/11/17 面试题
高中教师评语大全
2014/04/25 职场文书
小学感恩节活动策划方案
2014/10/06 职场文书
施工员岗位职责
2015/02/10 职场文书
锦旗赠语
2015/06/23 职场文书
小程序教您怎样你零成本推广获取数万用户的方法
2019/07/30 职场文书
总结python多进程multiprocessing的相关知识
2021/06/29 Python
MySQL派生表联表查询实战过程
2022/03/20 MySQL
Ruby使用Mysql2连接操作MySQL
2022/04/19 Ruby