JS实现对中文字符串进行utf-8的Base64编码的方法(使其与Java编码相同)


Posted in Javascript onJune 21, 2016

本文实例讲述了JS实现对中文字符串进行utf-8的Base64编码的方法。分享给大家供大家参考,具体如下:

要进行编码的字符串:“select 用户名 from 用户”

使用JAVA进行编码,Java程序:

String sql = "select 用户名 from 用户";
String encodeStr = new String(Base64.encode(sql.getBytes("UTF-8"))); // 编码
System.out.println(encodeStr);

得到:

c2VsZWN0IOeUqOaIt+WQjSBmcm9tIOeUqOaItw==

在Java中解码:

sql = new String(Base64.decode(sql.getBytes()), "UTF-8");

Java代码中为什么要使用getBytes("UTF-8")呢?因为Windows和Linux环境下默认编码不同,要使你的程序在不同平台下得到相同编码,必然要指定编码

虽然Html和JS的编码都是utf-8,但JS从页面上得到的中文编码却是utf-16,所以直接对中文进行Base64编码将得到错误的结果,所以我们要先从utf-16转到utf-8再编码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
<!--
body{
 margin:0px;
 padding:0px;
}
body,td{
 font-size:9pt;
}
-->
</style>
<script type="text/JavaScript">
<!--
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
//将Ansi编码的字符串进行Base64编码
function encode64(input) {
var output = "";
var chr1, chr2, chr3 = "";
var enc1, enc2, enc3, enc4 = "";
var i = 0;
do {
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);
chr1 = chr2 = chr3 = "";
enc1 = enc2 = enc3 = enc4 = "";
} while (i < input.length);
return output;
}
//将Base64编码字符串转换成Ansi编码的字符串
function decode64(input) {
var output = "";
var chr1, chr2, chr3 = "";
var enc1, enc2, enc3, enc4 = "";
var i = 0;
if (input.length % 4 != 0) {
return "";
}
var base64test = /[^A-Za-z0-9\+\/\=]/g;
if (base64test.exec(input)) {
return "";
}
do {
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 += String.fromCharCode(chr2);
}
if (enc4 != 64) {
output += String.fromCharCode(chr3);
}
chr1 = chr2 = chr3 = "";
enc1 = enc2 = enc3 = enc4 = "";
} while (i < input.length);
return output;
}
function utf16to8(str) {
 var out, i, len, c;
 out = "";
 len = str.length;
 for(i = 0; i < len; i++) {
  c = str.charCodeAt(i);
  if ((c >= 0x0001) && (c <= 0x007F)) {
   out += str.charAt(i);
  } else if (c > 0x07FF) {
   out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
   out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
   out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
  } else {
   out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
   out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
  }
 }
 return out;
}
function utf8to16(str) {
 var out, i, len, c;
 var char2, char3;
 out = "";
 len = str.length;
 i = 0;
 while(i < len) {
  c = str.charCodeAt(i++);
  switch(c >> 4) {
   case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
    // 0xxxxxxx
    out += str.charAt(i-1);
    break;
   case 12: case 13:
    // 110x xxxx  10xx xxxx
    char2 = str.charCodeAt(i++);
    out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
    break;
   case 14:
    // 1110 xxxx 10xx xxxx 10xx xxxx
    char2 = str.charCodeAt(i++);
    char3 = str.charCodeAt(i++);
    out += String.fromCharCode(((c & 0x0F) << 12) |
    ((char2 & 0x3F) << 6) |
    ((char3 & 0x3F) << 0));
    break;
  }
 }
 return out;
}
// 测试代码 开始
var de = encode64(utf16to8("select 用户名 from 用户"));
document.writeln(de+"<br>");
var ee = utf8to16(decode64(de))
document.writeln(ee);
// 测试代码 结束
//-->
</script>
</head>
<body>
</body>
</html>

上面的代码都是从网上得来,拼凑后得到正确结果,在此感谢前辈们

PS:这里再为大家推荐几款base64编码解码在线工具,相信在以后的开发中会用得到:

BASE64编码解码工具:
http://tools.3water.com/transcoding/base64

在线图片转换BASE64工具:
http://tools.3water.com/transcoding/img2base64

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Document 对象的常用方法
Jul 31 Javascript
单独使用CKFinder选择图片的方法
Aug 21 Javascript
使用原生javascript创建通用表单验证——更锋利的使用dom对象
Sep 13 Javascript
JavaScript中的变量定义与储存介绍
Dec 31 Javascript
jQuery实现判断滚动条到底部
Jun 23 Javascript
javascript学习笔记之函数定义
Jun 25 Javascript
浅谈javascript原型链与继承
Jul 13 Javascript
Ionic如何创建APP项目
Jun 03 Javascript
十大 Node.js 的 Web 框架(快速提升工作效率)
Jun 30 Javascript
微信小程序中吸底按钮适配iPhone X方案
Nov 29 Javascript
浅析vue-router原理
Oct 19 Javascript
基于vue实现一个神奇的动态按钮效果
May 15 Javascript
第十篇BootStrap轮播插件使用详解
Jun 21 #Javascript
JavaScript简单获取页面图片原始尺寸的方法
Jun 21 #Javascript
第九篇Bootstrap导航菜单创建步骤详解
Jun 21 #Javascript
js简单判断flash是否加载完成的方法
Jun 21 #Javascript
第八篇Bootstrap下拉菜单实例代码
Jun 21 #Javascript
JS实现获取剪贴板内容的方法
Jun 21 #Javascript
第七篇Bootstrap表单布局实例代码详解(三种表单布局)
Jun 21 #Javascript
You might like
异世界新番又来了,同样是从零开始,男主的年龄降到5岁
2020/04/09 日漫
WINDOWS 2000下使用ISAPI方式安装PHP
2006/09/05 PHP
PHP sdk文档处理常用代码示例解析
2020/12/09 PHP
JavaScript 学习笔记一些小技巧
2010/03/28 Javascript
jquery 插件学习(六)
2012/08/06 Javascript
JQuery异步加载无限下拉框级联功能实现示例
2014/02/19 Javascript
介绍JavaScript的一个微型模版
2015/06/24 Javascript
JQuery悬停控制图片轮播——代码简单
2015/08/05 Javascript
Validform表单验证总结篇
2016/10/31 Javascript
微信小程序实现图片自适应(支持多图)
2017/01/25 Javascript
Angular 2父子组件数据传递之@Input和@Output详解 (上)
2017/07/05 Javascript
React学习之事件绑定的几种方法对比
2017/09/24 Javascript
Vue-router的使用和出现空白页,路由对象属性详解
2018/09/03 Javascript
如何利用vue+vue-router+elementUI实现简易通讯录
2019/05/13 Javascript
vue实现按需加载组件及异步组件功能
2019/05/27 Javascript
使用实现XlsxWriter创建Excel文件并编辑
2018/05/04 Python
Numpy之文件存取的示例代码
2018/08/03 Python
解决python "No module named pip" 的问题
2018/10/13 Python
python实现比较类的两个instance(对象)是否相等的方法分析
2019/06/26 Python
Python使用python-docx读写word文档
2019/08/26 Python
adidas澳大利亚官方网站:adidas Australia
2018/04/15 全球购物
华为菲律宾官方网站:HUAWEI Philippines
2021/02/23 全球购物
.NET初级开发工程师面试题
2014/04/18 面试题
工程造价与管理专业应届生求职信
2013/11/23 职场文书
青年教师培训方案
2014/02/06 职场文书
幼儿园五一活动方案
2014/02/07 职场文书
十八届三中全会学习方案
2014/02/16 职场文书
机械设计及其自动化专业求职信
2014/06/09 职场文书
药品营销专业毕业生自荐信
2014/07/02 职场文书
班级课外活动总结
2014/07/09 职场文书
学生检讨书怎么写
2014/10/09 职场文书
学校政风行风整改方案
2014/10/25 职场文书
留学推荐信怎么写
2015/03/26 职场文书
物业前台接待岗位职责
2015/04/03 职场文书
学习新党章心得体会2016
2016/01/15 职场文书
工作计划范文之财务管理
2019/08/09 职场文书