jQuery实现base64前台加密解密功能详解


Posted in jQuery onAugust 29, 2017

本文实例讲述了jQuery实现base64前台加密解密功能。分享给大家供大家参考,具体如下:

关于加密,很多人想到encodeURI和escape。这个对加密url,尤其是带中文参数的url很有用。

如果只是想做加密解密,类似于Java的DES,网上jQuery有个jquery.base64.js。

(关于js的md5加密可以用jquery.md5.js,有兴趣可以找来测试一下)。

下面是测试:

<html>
<head>
  <title></title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <script language="javascript" src="jquery-1.7.1.js"></script>
  <script language="javascript" src="jquery.base64.js"></script>
</head>
<body>
<input id="path" name="path" type="hidden" value="haha"></input>
<input id="putcardno01" name="putcardno01" type="text" size="65" value=""></input>
<br>
<input onclick="subfunc();" class="btn1" value="提交加密"  type="button"></input>
<br>
加密后:<input id="putcardno02" name="putcardno02" type="text" size="65" value=""></input>
<br>
<input onclick="subfunc02();" class="btn1" value="提交解密"  type="button"></input>
<br>
<br>
<hr>
<input onclick="subfunc03();" class="btn1" value="提交N次加密"  type="button"></input>
<br>
加密后:<input id="putcardno03" name="putcardno03" type="text" size="65" value=""></input>
<br>
<input onclick="subfunc04();" class="btn1" value="提交N次解密"  type="button"></input>
<br>
<br>
<input onclick="clearrr();" class="btn1" value="清除"  type="button"></input>
<br>
<textarea id='txt' cols="75" rows="19"></textarea>
</body>
<script language="javascript">
var path=document.getElementById("path").value;
function app(info){
  $("#txt").val($("#txt").val()+'\n'+info);
}
function subfunc(){
 var put1=$.trim($("#putcardno01").val());
 // var estxt=$.base64.encode(put1);
 //var estxt=$.base64.btoa(put1);
 var estxt=encodeBase64(put1);
 $("#putcardno02").val(estxt);
 app("加密后["+estxt+"]");
}
function subfunc02(){
 var put1=$.trim($("#putcardno02").val());
 //var estxt=$.base64.decode(put1);
 //var estxt=$.base64.atob(put1);
 var estxt=decodeBase64(put1);
 app("解密后["+estxt+"]");
}
//////////////////////////////////////////
var numTimes=5;
function subfunc03(){
 var put1=$.trim($("#putcardno01").val());
 // var estxt=$.base64.encode(put1);
 //var estxt=$.base64.btoa(put1);
 //estxt=$.base64.btoa(estxt);
 estxt=encodeBase64(put1,numTimes);
 $("#putcardno03").val(estxt);
 app(numTimes+"次加密后["+estxt+"]");
}
function subfunc04(){
 var put1=$.trim($("#putcardno03").val());
 //var estxt=$.base64.decode(put1);
 //var estxt=$.base64.atob(put1);
 //estxt=$.base64.atob(estxt);
 estxt=decodeBase64(put1,numTimes);
 app(numTimes+"次解密后["+estxt+"]");
}
function clearrr(){
 $("#putcardno02").val("");
 $("#putcardno03").val("");
 $("#putcardno04").val("");
 $("#txt").val("");
}
//加密方法。没有过滤首尾空格,即没有trim.
//加密可以加密N次,对应解密N次就可以获取明文
function encodeBase64(mingwen,times){
  var code="";
  var num=1;
  if(typeof times=='undefined'||times==null||times==""){
    num=1;
  }else{
    var vt=times+"";
    num=parseInt(vt);
  }
  if(typeof mingwen=='undefined'||mingwen==null||mingwen==""){
  }else{
    $.base64.utf8encode = true;
    code=mingwen;
    for(var i=0;i<num;i++){
      code=$.base64.btoa(code);
    }
  }
  return code;
}
//解密方法。没有过滤首尾空格,即没有trim
//加密可以加密N次,对应解密N次就可以获取明文
function decodeBase64(mi,times){
  var mingwen="";
  var num=1;
  if(typeof times=='undefined'||times==null||times==""){
    num=1;
  }else{
    var vt=times+"";
    num=parseInt(vt);
  }
  if(typeof mi=='undefined'||mi==null||mi==""){
  }else{
    $.base64.utf8encode = true;
    mingwen=mi;
    for(var i=0;i<num;i++){
      mingwen=$.base64.atob(mingwen);
    }
  }
  return mingwen;
}
/*
测试
输入 suolong2014version
加密后[c3VvbG9uZzIwMTR2ZXJzaW9u]
解密后[suolong2014version]
5次加密后[VjFod1QxWXlVblJUYTJoUVYwWmFhRnBYZEhOTk1WSlhWV3hPVG1KSVFscFZNalYzWVVaYU5tSkVSVDA9]
5次解密后[suolong2014version]
*/
</script>

在后台加密解密是不是和前台一样?

我们测试一下:

package com.code;
import sun.misc.BASE64Decoder;
import sun.misc.BASE64Encoder;
/**
 *
 * Base64加密--解密
 *
 * @author lushuaiyin
 *
 */
public class Base64Util {
  /**
   * @param args
   */
  public static void main(String[] args) {
    // TODO Auto-generated method stub
    String str="suolong2014version";
    System.out.println("测试明文["+str+"]");
    String basecode =Base64Util.encodeBase64(str);
    System.out.println("加密后["+basecode+"]");
    if(basecode!=null){
      String res =Base64Util.decodeBase64(basecode);
      System.out.println("解密后["+res+"]");
    }
    /////////////////////////////////////////
    System.out.println("");
    System.out.println("N次加密测试--------");
    String basecodeN=Base64Util.encodeBase64(str, 2);
    String resN=Base64Util.decodeBase64(basecodeN, 2);
    String basecodeN3=Base64Util.encodeBase64(str, 5);
    String resN3=Base64Util.decodeBase64(basecodeN3, 5);
  }
  //提供加密N次
  public static String encodeBase64(String mingwen,int times){
    int num=(times<=0)?1:times;
    String code="";
    if(mingwen==null||mingwen.equals("")){
    }else{
      code=mingwen;
      for(int i=0;i<num;i++){
        code=encodeBase64(code);
      }
      System.out.println("加密"+num+"次后["+code+"]");
    }
    return code;
  }
  //对应提供解密N次
  public static String decodeBase64(String mi,int times){
    int num=(times<=0)?1:times;
    String mingwen="";
    if(mi==null||mi.equals("")){
    }else{
      mingwen=mi;
      for(int i=0;i<num;i++){
        mingwen=decodeBase64(mingwen);
      }
      System.out.println("解密"+num+"次后["+mingwen+"]");
    }
    return mingwen;
  }
  ///////////////////////////////////////////////////////////////////
  public static String encodeBase64(String mingwen){
    String code="";
    if(mingwen==null||mingwen.equals("")){
    }else{
      BASE64Encoder encoder = new BASE64Encoder();
      try {
        code=encoder.encode(mingwen.getBytes());
      } catch (Exception e) {
        e.printStackTrace();
      }
//     System.out.println("加密后["+code+"]");
    }
    return code;
  }
  public static String decodeBase64(String mi){
    String mingwen="";
    if(mi==null||mi.equals("")){
    }else{
      BASE64Decoder decoder = new BASE64Decoder();
      try {
        byte[] by = decoder.decodeBuffer(mi);
        mingwen = new String(by);
      } catch (Exception e) {
        e.printStackTrace();
      }
//     System.out.println("解密后["+mingwen+"]");
    }
    return mingwen;
  }
}
/*
打印:
测试明文[suolong2014version]
加密后[c3VvbG9uZzIwMTR2ZXJzaW9u]
解密后[suolong2014version]
N次加密测试--------
加密2次后[YzNWdmJHOXVaekl3TVRSMlpYSnphVzl1]
解密2次后[suolong2014version]
加密5次后[VjFod1QxWXlVblJUYTJoUVYwWmFhRnBYZEhOTk1WSlhWV3hPVG1KSVFscFZNalYzWVVaYU5tSkVS
VDA9]
解密5次后[suolong2014version]
*/

从结果上看,jquery.base64.js加密解密和java的base64加密解密是一样的。

jQuery 相关文章推荐
jquery中each循环的简单回滚操作
May 05 jQuery
jQuery实现在HTML文档加载完毕后自动执行某个事件的方法
May 08 jQuery
jquery单击文字或图片内容放大并居中显示
Jun 23 jQuery
jQuery实现动态给table赋值的方法示例
Jul 04 jQuery
jQuery常见面试题之DOM操作详析
Jul 05 jQuery
浅谈jQuery框架Ajax常用选项
Jul 08 jQuery
jQuery动态添加li标签并添加属性和绑定事件方法
Feb 24 jQuery
jQuery简单判断值是否存在于数组中的方法示例
Apr 17 jQuery
JQuery的加载和选择器用法简单示例
May 13 jQuery
jquery+php后台实现省市区联动功能示例
May 23 jQuery
jQuery操作事件完整实例分析
Jan 10 jQuery
jQuery实现移动端扭蛋机抽奖
Nov 08 jQuery
jquery在vue脚手架中的使用方式示例
Aug 29 #jQuery
jQuery 实现鼠标画框并对框内数据选中的实例代码
Aug 29 #jQuery
jQuery实现锚点向下平滑滚动特效示例
Aug 29 #jQuery
jQuery 1.9版本以上的浏览器判断方法代码分享
Aug 28 #jQuery
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 #jQuery
解决IE7中使用jQuery动态操作name问题
Aug 28 #jQuery
jQuery菜单实例(全选,反选,取消)
Aug 28 #jQuery
You might like
索尼SONY ICF-7600A(W)电路分析
2021/03/01 无线电
php基于Snoopy解析网页html的方法
2015/07/09 PHP
PHP+Mysql+jQuery实现发布微博程序 php篇
2015/10/15 PHP
php给数组赋值的实例方法
2019/09/26 PHP
PHP实现笛卡尔积算法的实例讲解
2019/12/22 PHP
JS的千分位算法实现思路
2013/07/31 Javascript
jQuery使用drag效果实现自由拖拽div
2015/06/11 Javascript
详解Javacript和AngularJS中的Promises
2016/02/09 Javascript
JavaScript 定时器 SetTimeout之定时刷新窗口和关闭窗口(代码超简单)
2016/02/26 Javascript
JavaScript地理位置信息API
2016/06/11 Javascript
浅析Javascript的自动分号插入(ASI)机制
2016/09/29 Javascript
Vue.js第二天学习笔记(vue-router)
2016/12/01 Javascript
浅析jQuery操作select控件的取值和设值
2016/12/07 Javascript
AngularJS 控制器 controller的详解
2017/10/17 Javascript
Vue表情输入组件 微信face表情组件
2019/02/11 Javascript
Python网页解析利器BeautifulSoup安装使用介绍
2015/03/17 Python
python中xrange用法分析
2015/04/15 Python
Python中使用bidict模块双向字典结构的奇技淫巧
2016/07/12 Python
python3实现字符串的全排列的方法(无重复字符)
2018/07/07 Python
对Python3 序列解包详解
2019/02/16 Python
Python字符串的常见操作实例小结
2019/04/08 Python
Python CSV文件模块的使用案例分析
2019/12/21 Python
Python matplotlib实时画图案例
2020/04/23 Python
Python如何在windows环境安装pip及rarfile
2020/06/15 Python
Python Socket多线程并发原理及实现
2020/12/11 Python
新西兰杂志订阅:isubscribe
2019/08/26 全球购物
MIS软件工程师的面试题
2016/04/22 面试题
事假请假条范文
2014/04/11 职场文书
市场开发计划书
2014/05/07 职场文书
员工保密承诺书
2014/05/28 职场文书
英语系本科生求职信
2014/07/15 职场文书
教师师德考核自我评价
2014/09/13 职场文书
民主生活会对照检查材料思想汇报
2014/09/27 职场文书
致短跑运动员加油稿
2015/07/21 职场文书
团结主题班会
2015/08/13 职场文书
ORM模型框架操作mysql数据库的方法
2021/07/25 MySQL