`
yiminghe
  • 浏览: 1431483 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

javascript生成zip编码问题

阅读更多

jsZip   一个接口很明确的用 javascript 生成 zip 文件的库,它利用了标准浏览器的 data 协议 可以使得 javascript 生成的内容由用户保存到本地文件,但是由于作者主要处于英文环境下,对于其他语言文字比如中文考虑不太周全,可以在其首页实验一下中文文件名称和中文内容。

(firefox,safari可用, 注意下载文件须手动修改后缀名为 zip )

 

分析其实现:

利用 javascript 中单个字符表示其他程序语言中的 byte 概念,zip格式的二进制控制字符以及整数通过\xyy编码到javascript字符串中,再利用base64编码对每三个字符所表示的二进制byte(charCode)编码为4个 base64编码


整数编码到字符串(字符数组 == byte数组)

原始代码用 eval 封装 byte 到字符,比较难看,我修改为 String.fromCharCode

 

JSZip.prototype.decToHex = function(dec, bytes)
{
   var hex = "";
	for(var i=0;i<bytes;i++) {
		hex+=String.fromCharCode(dec&0xff);
		dec=dec>>>8;
	}
/*
   for (var i = 0; i<bytes*2; i+=2)
   {
      var t = (dec >>> (i*4)) & 0xFF;
      t = t.toString(16);
      if (t.length != 2) t = "0"+t;
      hex += eval("'\\x"+t+"'");
   }*/

   return hex;
};

 

再对字符数组进行 base64编码,利用charCode取出字符封装的原二进制byte数据

_keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

encode : function (input) {
		var output = "";
		var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
		var i = 0;

		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 +
			this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
			this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

		}

		return output;
	},

 


问题:

这里就存在一个问题,js中文中字符内部为2个字符(unicode表示),存储后和具体编码方式相关(utf-8,gbk),而不像英文一样无论(gbk,utf-8)可以视作一个byte,那么我们可以事先将js字符串中的中文字符手动拆解为目标编码 utf-8 表示的三个byte即三个字符,(之所以采用utf-8,而不是其他本地字符编码,encodeURIComponent可以方便得到中文的utf-8编码,而不需要采用外部工具) :

 

utf8Encode:function(input){
		input=encodeURIComponent(input);
		return this._transfer(input);
	},
	
	_transfer:function(input){
		input=input.replace(/%.{2,2}/g,function(m){
			var hex=m.substring(1);
			return String.fromCharCode(parseInt(hex,16));
		});
		return input;
	},

 即将一个字符的utf-8表示的三个byte,封装到三个字符中去,每个字符的charcode表示原来字符utf-8编码的一个byte,这样子的话下面的 base64编码就可以像以前一样了。



演示:

注意目前只有 firefox,safari 稍微正常电

 

演示@google code

 

 

 

 

 

 

0
0
分享到:
评论

相关推荐

    JavaScript的GIF动画生成gif.js.zip

    gif.js 是一个可直接在浏览器上运行的 JavaScript GIF 编码器。支持的浏览器包括:Google ChromeFirefox 17Safari 6Internet Explorer 10Mobile Safari iOS 6使用方法:var gif = new GIF({ workers: 2, ...

    ApacheAvro纯JavaScript实现avsc.zip

    avsc 是 Apache Avro 的纯 JavaScript 实现。特性:完整的 Avro 架构支持,包括递归架构, sort order, 以及 schema evolution.快速!速度相当于 JSON 的两倍,同时更少的编码(varies per schema).无依赖, avsc 甚至...

    JavaScript基础教程第8版

    6.9 检验Zip编码 122 6.10 验证电子邮件地址 126 第7章 表单和正则表达式 131 7.1 用正则表达式验证电子邮件地址 131 7.2 验证文件名 136 7.3 提取字符串 139 7.4 格式化字符串 141 7.5 对字符串...

    基于HTML和JavaScript的智慧养老社区平台后台管理系统源码+sql数据库+项目说明.zip

    基于HTML和JavaScript的智慧养老社区平台后台管理系统源码+sql数据库+项目说明.zip 【资源介绍】 智慧化养老社区平台后端,采用Ruoyi作为脚手架 内置功能 用户管理:用户是系统操作者,该功能主要完成系统用户配置...

    茶叶种植大数据溯源平台.zip

    数据安全性:软件通过使用HTML、CSS和JavaScript的安全编码实践,确保用户数据的安全性和保密性。同时,也要遵守相关的数据隐私规定和标准,保护用户隐私。 总体而言,茶叶种植大数据溯源平台利用HTML、CSS和JavaSc

    二维码生成器.zip(小程序+JAVA+2024+最新+毕业设计+源码+PPT+Lw+使用说明+部署简单+操作简单+上手简单

    小程序的开发框架基于JavaScript语言,同时结合了WXML(微信标记语言)和WXSS(微信样式表)来定义页面结构和样式。此外,为了方便数据处理,还可以使用基于JavaScript的逻辑层框架。 在功能设计上,小程序可以实现...

    java开源包1

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包11

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包2

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包3

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包6

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包5

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包10

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包4

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包8

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包7

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包9

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    java开源包101

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    Java资源包01

    利用Google:maps JSP标签库就能够在你的Web站点上实现GoogleMaps的所有功能而且不需要javascript或AJAX编程。它还能够与JSTL相结合生成数据库驱动的动态Maps。 OAuth 实现框架 Agorava Agorava 是一个实现了 OAuth ...

    Koala UI 1.0.0.zip

    让其更易读、友好规范的统一编码风格Koala UI组件的编码参照了Bootstrap的风格,包括组件的属性、方法和事件,都比较接近标准的JavaScript面向对象风格规范的代码注释Koala UI的API目前使用yuidoc生成,因此注释风格...

Global site tag (gtag.js) - Google Analytics