这次给大家带来Ajax怎么发送和接收二进制字节的数据,Ajax发送和接收二进制字节的数据的注意事项有哪些,下面就是实战案例,一起来看一下。

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.responseText

if (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告诉浏览器不要解析数据

相信看了本文案例你已经掌握了方法,更多精彩请关注Gxl网其它相关文章!

推荐阅读:

JSONP怎么处理Ajax的跨域访问

ajax操作全局监测,用户session失效怎么处理

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐