Ajax method for sending and receiving binary byte stream data-JS Tutorial-php.cn

Ajax method for sending and receiving binary byte stream data

亚连

Release： 2018-05-23 17:34:40

Original

5353 people have browsed it

This article mainly introduces the method of sending and receiving binary byte stream data in Ajax. It is very good and has reference value. Friends who are interested should take a look together

In the HTML5 Ajax 2.0 standard, enhancements It has many functions of Ajax, including sending FormData data, uploading data progress bar and many other functions. But in fact, Ajax can send binary data by bytes.

Send binary data

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

Copy after login

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);

Copy after login

Receive binary data

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);

Copy after login

Of course, the above setting can only be for text type. If it is Blob type, then the following can be done

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();

Copy after login

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

Copy after login

If you are using an old version Browser, then loading the binary can be as follows

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

Copy after login

Note: x-user-defined tells the browser not to parse the data

The above is what I compiled for everyone, I hope it will be helpful to everyone in the future.

Using Ajax technology to partially refresh product quantity and total price example code

Perfect solution to ajax access when encountering Session Invalid problem

The reason why ajax internal value cannot be called externally and the solution

The above is the detailed content of Ajax method for sending and receiving binary byte stream data. For more information, please follow other related articles on the PHP Chinese website!