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实现的图片点击滚动效果
Apr 29 Javascript
BAT及各大互联网公司2014前端笔试面试题--JavaScript篇
Oct 29 Javascript
jQuery获取页面及个元素高度、宽度的总结——超实用
Jul 28 Javascript
跟我学习javascript的for循环和for...in循环
Nov 18 Javascript
Bootstrap面板(Panels)的简单实现代码
Mar 17 Javascript
JavaScript中使用webuploader实现上传视频功能(demo)
Apr 10 Javascript
VueJS事件处理器v-on的使用方法
Sep 27 Javascript
Parcel 打包示例(React HelloWorld)
Jan 16 Javascript
vue实现在线学生录入系统
May 30 Javascript
在vue中实现echarts随窗体变化
Jul 27 Javascript
浅谈javascript如何获取文件后缀名
Aug 07 Javascript
字节飞书面试promise.all实现示例
Jun 16 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的博客ping服务代码
2012/02/04 PHP
Drupal7 form表单二次开发要点与实例
2014/03/02 PHP
php获得url参数中具有&amp;的值的方法
2014/03/05 PHP
php+xml编程之SimpleXML的应用实例
2015/01/24 PHP
PHP实现的随机IP函数【国内IP段】
2016/07/20 PHP
laravel框架模型和数据库基础操作实例详解
2020/01/25 PHP
jquery cookie插件代码类
2009/05/26 Javascript
javascript unicode与GBK2312(中文)编码转换方法
2013/11/14 Javascript
jquery遍历checkbox的注意事项说明
2014/02/21 Javascript
按下回车键指向下一个位置的一个函数代码
2014/03/10 Javascript
小议JavaScript中Generator和Iterator的使用
2015/07/29 Javascript
jquery点赞功能实现代码 点个赞吧!
2020/05/29 jQuery
validationEngine 表单验证插件使用实例代码
2017/06/15 Javascript
原生JS实现日历组件的示例代码
2017/09/22 Javascript
webpack4的迁移的使用方法
2018/05/25 Javascript
JS删除对象中某一属性案例详解
2020/09/08 Javascript
pycharm 使用心得(二)设置字体大小
2014/06/05 Python
python字符串连接的N种方式总结
2014/09/17 Python
利用ctypes获取numpy数组的指针方法
2019/02/12 Python
Python partial函数原理及用法解析
2019/12/11 Python
Python MySQL 日期时间格式化作为参数的操作
2020/03/02 Python
Pygame的程序开始示例代码
2020/05/07 Python
python模拟点击玩游戏的实例讲解
2020/11/26 Python
巧用 CSS3的webkit-box-reflect 倒影实现各类动效
2021/03/05 HTML / CSS
海淘母婴商城:国际妈咪
2016/07/23 全球购物
SOA的常见陷阱或者误解是什么
2014/10/05 面试题
餐厅考勤管理制度
2014/01/28 职场文书
老总助理工作岗位职责
2014/02/06 职场文书
《梅花魂》教学反思
2014/04/30 职场文书
2014年度安全生产目标管理责任书
2014/07/25 职场文书
高速铁道技术专业求职信
2014/08/09 职场文书
法定代表人授权委托书格式
2014/10/14 职场文书
2015选调生工作总结
2015/07/24 职场文书
2016年村党支部公开承诺书
2016/03/24 职场文书
总结一下关于在Java8中使用stream流踩过的一些坑
2021/06/24 Java/Android
一文搞懂MySQL索引页结构
2022/02/28 MySQL