Ajax发送和接收二进制字节流数据的方法

前端  /  管理员 发布于 4年前   305

HTML5 Ajax 2.0标准中，增强了Ajax的许多功能，包括发送FormData数据，上传数据进度条等诸多功能。但实际上，Ajax可以字节发送二进制数据。

发送二进制数据

var oReq = new XMLHttpRequest();oReq.open("POST", url, true);oReq.onload = function (oEvent) {// Uploaded.};var blob = new Blob(['abc123'], {type: 'text/plain'});oReq.send(blob);

或者

var myArray = new ArrayBuffer(512);var longInt8View = new Uint8Array(myArray);for (var i=0; i< longInt8View.length; i++) {longInt8View[i] = i % 255;}var xhr = new XMLHttpRequest;xhr.open("POST", url, false);xhr.send(myArray);

接收二进制数据

var oReq = new XMLHttpRequest();oReq.open("GET", "/myfile.png", true);oReq.responseType = "arraybuffer";oReq.onload = function (oEvent) {var arrayBuffer = oReq.response; // Note: not oReq.responseTextif (arrayBuffer) {var byteArray = new Uint8Array(arrayBuffer);for (var i = 0; i < byteArray.byteLength; i++) {}}};oReq.send(null);

当然，如上设置只能是文本类型，如果是Blob类型，那么如下即可

var oReq = new XMLHttpRequest();oReq.open("GET", "/myfile.png", true);oReq.responseType = "arraybuffer";oReq.onload = function(oEvent) {var blob = new Blob([oReq.response], {type: "image/png"});// ...};oReq.send();

或者

var oReq = new XMLHttpRequest();oReq.open("GET", "/myfile.png", true);oReq.responseType = "blob";oReq.onload = function(oEvent) {var blob = oReq.response;// ...};oReq.send();

如果你使用的是旧版本的浏览器，那么加载二进制可以如下

function load_binary_resource(url) {var req = new XMLHttpRequest();req.open('GET', url, false);//XHR binary charset opt by Marcus Granado 2006 [http://mgran.blogspot.com]req.overrideMimeType('text\/plain; charset=x-user-defined');req.send(null);if (req.status != 200) return '';return req.responseText;}

注意:x-user-defined告诉浏览器不要解析数据

以上所述是小编给大家介绍的Win7任务栏Ajax发送和接收二进制字节流数据的方法的相关知识，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对站的支持！