JS 借助 pako.js 实现网络请求获取 gzip 数据流并解析, 解决汉字乱码
2017-12-06 14:05
781 查看
1, 下载 pako.js => http://nodeca.github.io/pako/#Deflate.prototype.onData
2, 首先需要了解一下 XMLHttpRequest 2.0 => https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest
3, 已 GET 请求为例, 红色注释部分为关键步骤
2, 首先需要了解一下 XMLHttpRequest 2.0 => https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest
3, 已 GET 请求为例, 红色注释部分为关键步骤
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>网络请求获取 GZIP 格式的数据流, 并解析</title> <script src="../commom/pako.min.js"></script> </head> <body> <div id="box" style="font-size: 30px"></div> </body> <script type="text/javascript"> var Ajax = (function () { var Utf8ArrayToStr = function(array) { // 数据流转化为字符串, 兼容汉字 var out = "", i = 0, len = array.length, char1, char2, char3, char4; while(i < len) { char1 = array[i++]; // 当单个字节时, 最大值 '01111111', 最小值 '00000000' 右移四位 07, 00 // 当两个字节时, 最大值 '11011111', 最小值 '11000000' 右移四位 13, 12 // 当三个字节时, 最大值 '11101111', 最小值 '11100000' 右移四位 14, 14 if (char1 >> 4 <= 7) { out += String.fromCharCode(char1); } else if (char1 >> 4 == 12 || char1 >> 4 == 13) { char2 = array[i++]; out += String.fromCharCode(((char1 & 0x1F) << 6) | (char2 & 0x3F)); } else if (char1 >> 4 == 14) { char2 = array[i++]; char3 = array[i++]; char4 = ((char1 & 0x0F) << 12) | ((char2 & 0x3F) << 6); out += String.fromCharCode(char4 | ((char3 & 0x3F) << 0)); } } return out; }; return function (url, json, fn) { // 返回一个网络请求方法 var ajax = new XMLHttpRequest(); // 实例化一个 网络请求 url += "?"; for(key in json) { url += key + "=" + json[key] + "&"; } url = url.substr(0, url.length - 1); ajax.open("get", url, true); // 开启一个网络请求 ajax.responseType = "arraybuffer"; // 声明返回的是二进制数据流 ajax.onload = function () { if(ajax.response) { var byteArray = new Uint8Array(ajax.response); // 切换数据编码为 byteArray = pako.ungzip(byteArray); // 调用 pako 的方法解压数据 fn(Utf8ArrayToStr(byteArray)); } else { fn("没有获取到任何数据"); } }; ajax.send(null); // 发起请求 } })(); Ajax("../files/gzip.gz", {}, function (ret) { console.log(ret + "1") }); Ajax("../files/gzips.gz", {}, function (ret) { console.log(ret + "2") }); </script> </html>
相关文章推荐
- pako.js对数据进行gzip压缩传递到后台解析,解决数据量大的请求问题
- volley 访问网络时候获取json数据发生乱码问题解决方法,以及gson解析json数据。
- JS获取URL后的参数并且解析汉字乱码
- 解决get请求乱码问题,js实现post请求
- Java网络编程获取网页的乱码问题解决
- ajax的js中url传送特殊字符和中文汉字的乱码解决
- servlet和action中获取URL中的汉字(解决URL中汉字为乱码的问题)
- 解决Js解析xml浏览器不兼容问题及省市区三级联动实现
- VB的Winsock控件GetData方法获取汉字乱码解决方法
- (转)用js无法获取style样式的问题解析与解决方法
- 解决 c# js url 乱码,c# url 编码 UrlEncode,javascript url 编码 encodeURI,解析
- eclipse的js文件中汉字是乱码怎么解决,更改eclipse的编码方式
- 解决js中传值,Action获取是乱码问题
- (造福中国前端界)纯前端Js完美解决各种汉字urlencode,urldecode,编码解码问题,不借助任何字库,内码表,轻松一行,兼容IE8+,chrome,firefox,safari等主流浏览器
- js提交表单中包含中文参数值,request请求参数正常,服务器端接收出现乱码解决思路
- 解决Js解析xml浏览器不兼容问题及省市区三级联动实现
- js传汉字在UTF-8标准的JSP页面中乱码的解决方法
- android 获取网络数据,回传到本地用TextView显示乱码问题解决方法
- 原创:Js解析xml文件并简单实现省市区级联菜单(并解决各浏览器兼容性问题).
- thrift的js客户端收到含汉字字符中显示为乱码解决方法