Skip to content

Instantly share code, notes, and snippets.

@aaronk6

aaronk6/jquery-ajax-blob-arraybuffer.js

Forked from SaneMethod/jquery-ajax-blob-arraybuffer.js
Last active June 1, 2020 19:10
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save aaronk6/bff7cc600d863d31a7bf to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save aaronk6/bff7cc600d863d31a7bf to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. aaronk6 revised this gist Jul 18, 2014. 1 changed file with 13 additions and 3 deletions.
    16 changes: 13 additions & 3 deletions jquery-ajax-blob-arraybuffer.js
    View file
    Original file line number Diff line number Diff line change
    @@ -38,10 +38,20 @@ $.ajaxTransport("+*", function(options, originalOptions, jqXHR){
    key;

    xhr.addEventListener('load', function(){
    var res = {};
    var response = {}, status, isSuccess;

    res[dataType] = xhr.response;
    completeCallback(xhr.status, xhr.statusText, res, xhr.getAllResponseHeaders());
    isSuccess = xhr.status >= 200 && xhr.status < 300 || xhr.status === 304;

    if (isSuccess) {
    response[dataType] = xhr.response;
    } else {
    // In case an error occured we assume that the response body contains
    // text data - so let's convert the binary data to a string which we can
    // pass to the complete callback.
    response.text = String.fromCharCode.apply(null, new Uint8Array(xhr.response));
    }

    completeCallback(xhr.status, xhr.statusText, response, xhr.getAllResponseHeaders());
    });

    xhr.open(type, url, async);
  2. aaronk6 revised this gist Jul 17, 2014. 1 changed file with 9 additions and 4 deletions.
    13 changes: 9 additions & 4 deletions jquery-ajax-blob-arraybuffer.js
    View file
    Original file line number Diff line number Diff line change
    @@ -14,9 +14,9 @@ $.ajaxTransport("+*", function(options, originalOptions, jqXHR){
    // Test for the conditions that mean we can/want to send/receive blobs or arraybuffers - we need XMLHttpRequest
    // level 2 (so feature-detect against window.FormData), feature detect against window.Blob or window.ArrayBuffer,
    // and then check to see if the dataType is blob/arraybuffer or the data itself is a Blob/ArrayBuffer
    if (window.FormData && ((options.dataType && (options.dataType == 'blob' || options.dataType == 'arraybuffer'))
    || (options.data && ((window.Blob && options.data instanceof Blob)
    || (window.ArrayBuffer && options.data instanceof ArrayBuffer)))
    if (window.FormData && ((options.dataType && (options.dataType === 'blob' || options.dataType === 'arraybuffer')) ||
    (options.data && ((window.Blob && options.data instanceof Blob) ||
    (window.ArrayBuffer && options.data instanceof ArrayBuffer)))
    ))
    {
    return {
    @@ -34,7 +34,8 @@ $.ajaxTransport("+*", function(options, originalOptions, jqXHR){
    type = options.type || 'GET',
    dataType = options.dataType || 'text',
    data = options.data || null,
    async = options.async || true;
    async = options.async || true,
    key;

    xhr.addEventListener('load', function(){
    var res = {};
    @@ -45,6 +46,10 @@ $.ajaxTransport("+*", function(options, originalOptions, jqXHR){

    xhr.open(type, url, async);
    xhr.responseType = dataType;

    for (key in headers) {
    if (headers.hasOwnProperty(key)) xhr.setRequestHeader(key, headers[key]);
    }
    xhr.send(data);
    },
    abort: function(){
  3. @SaneMethod SaneMethod created this gist Nov 19, 2013.
    55 changes: 55 additions & 0 deletions jquery-ajax-blob-arraybuffer.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,55 @@
    /**
    * Register ajax transports for blob send/recieve and array buffer send/receive via XMLHttpRequest Level 2
    * within the comfortable framework of the jquery ajax request, with full support for promises.
    *
    * Notice the +* in the dataType string? The + indicates we want this transport to be prepended to the list
    * of potential transports (so it gets first dibs if the request passes the conditions within to provide the
    * ajax transport, preventing the standard transport from hogging the request), and the * indicates that
    * potentially any request with any dataType might want to use the transports provided herein.
    *
    * Remember to specify 'processData:false' in the ajax options when attempting to send a blob or arraybuffer -
    * otherwise jquery will try (and fail) to convert the blob or buffer into a query string.
    */
    $.ajaxTransport("+*", function(options, originalOptions, jqXHR){
    // Test for the conditions that mean we can/want to send/receive blobs or arraybuffers - we need XMLHttpRequest
    // level 2 (so feature-detect against window.FormData), feature detect against window.Blob or window.ArrayBuffer,
    // and then check to see if the dataType is blob/arraybuffer or the data itself is a Blob/ArrayBuffer
    if (window.FormData && ((options.dataType && (options.dataType == 'blob' || options.dataType == 'arraybuffer'))
    || (options.data && ((window.Blob && options.data instanceof Blob)
    || (window.ArrayBuffer && options.data instanceof ArrayBuffer)))
    ))
    {
    return {
    /**
    * Return a transport capable of sending and/or receiving blobs - in this case, we instantiate
    * a new XMLHttpRequest and use it to actually perform the request, and funnel the result back
    * into the jquery complete callback (such as the success function, done blocks, etc.)
    *
    * @param headers
    * @param completeCallback
    */
    send: function(headers, completeCallback){
    var xhr = new XMLHttpRequest(),
    url = options.url || window.location.href,
    type = options.type || 'GET',
    dataType = options.dataType || 'text',
    data = options.data || null,
    async = options.async || true;

    xhr.addEventListener('load', function(){
    var res = {};

    res[dataType] = xhr.response;
    completeCallback(xhr.status, xhr.statusText, res, xhr.getAllResponseHeaders());
    });

    xhr.open(type, url, async);
    xhr.responseType = dataType;
    xhr.send(data);
    },
    abort: function(){
    jqXHR.abort();
    }
    };
    }
    });