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实现两个div中按钮互换位置的实例代码
Sep 21 jQuery
基于jquery实现五星好评
Nov 18 jQuery
jQuery中库的引用方法
Jan 06 jQuery
jQuery实现带右侧索引功能的通讯录示例【附源码下载】
Apr 17 jQuery
关于jquery中attr()和prop()方法的区别
May 28 jQuery
jQuery AJAX 方法success()后台传来的4种数据详解
Aug 08 jQuery
jQuery实现的中英文切换功能示例
Jan 11 jQuery
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
Feb 14 jQuery
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 jQuery
jquery分页优化操作实例分析
Aug 23 jQuery
jquery添加div实现消息聊天框
Feb 08 jQuery
jQuery实现动态加载瀑布流
Sep 01 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 SRF-S83/84电路分析和打磨
2021/03/02 无线电
PHP 数组遍历foreach语法结构及实例
2016/06/13 PHP
ThinkPHP框架整合微信支付之JSAPI模式图文详解
2019/04/09 PHP
php 根据URL下载远程图片、压缩包、pdf等文件到本地
2019/07/26 PHP
php实现银联商务公众号+服务窗支付的示例代码
2019/10/12 PHP
北京奥运官方网站幻灯切换效果flash版打包下载
2008/01/30 Javascript
node.js中的buffer.length方法使用说明
2014/12/14 Javascript
js随机生成字母数字组合的字符串 随机动画数字
2015/09/02 Javascript
7个jQuery最佳实践
2016/01/12 Javascript
Vue.js中用webpack合并打包多个组件并实现按需加载
2017/02/17 Javascript
Vue.js 动态为img的src赋值方法
2018/03/14 Javascript
使用Vue动态生成form表单的实例代码
2018/04/26 Javascript
vue修改对象的属性值后页面不重新渲染的实例
2018/08/09 Javascript
Vue实现美团app的影院推荐选座功能【推荐】
2018/08/29 Javascript
详解Vue-cli3 项目在安卓低版本系统和IE上白屏问题解决
2019/04/14 Javascript
JS中如何轻松遍历对象属性的方式总结
2019/08/06 Javascript
ES6使用新特性Proxy实现的数据绑定功能实例
2020/05/11 Javascript
vue中echarts的用法及与elementui-select的协同绑定操作
2020/11/17 Vue.js
[00:30]塑造者的传承礼包-戴泽“暗影之焰”套装展示视频
2014/04/04 DOTA
[02:59]2014DOTA2西雅图国际邀请赛 圆满落幕中国夺冠
2014/07/23 DOTA
python实现八大排序算法(1)
2017/09/14 Python
Python有序字典简单实现方法示例
2017/09/28 Python
Python读取MRI并显示为灰度图像实例代码
2018/01/03 Python
对Python 除法负数取商的取整方式详解
2018/12/12 Python
python 读取文件并把矩阵转成numpy的两种方法
2019/02/12 Python
在linux系统下安装python librtmp包的实现方法
2019/07/22 Python
Python多线程爬取豆瓣影评API接口
2019/10/22 Python
Python通过VGG16模型实现图像风格转换操作详解
2020/01/16 Python
python encrypt 实现AES加密的实例详解
2020/02/20 Python
一文读懂Python 枚举
2020/08/25 Python
CSS3使用transition实现的鼠标悬停淡入淡出
2015/01/09 HTML / CSS
哈利波特商店:Harry Potter Shop
2018/11/30 全球购物
泰国的头号网上婴儿用品店:Motherhood.co.th
2019/04/09 全球购物
Dr. Martens马汀博士澳大利亚官网:马丁靴鼻祖
2019/07/02 全球购物
高中军训感言200字
2014/02/23 职场文书
推普标语口号大全
2015/12/26 职场文书