Downloading a file using ajax

Webix JS
1

Back when I used ExtJS, I used to be able to get a file stored in a database (as a blob) by using var blob = new Blob([result.responseBytes], {type: ‘application/vnd.oasis.opendocument.spreadsheet’}); where result is the ajax response and the file will be downloaded as .ods, an opendocument spreadsheet.

Now, in webix, the ajax response object (data) doesn’t seem to have any way to get responsebytes do convert to a blob. Is there any way to do this?

2

Are you trying to offer a file for the client to download (like in this nifty hack)?

Webix is purely a client-side framework, so there’s no database involved. But don’t listen to me, I’m a Webix noob.

3

While it is indeed clientside, I can use ajax to send and receive data to and from a php file that connects to a database.

Thus, I use an ajax request to get a blob file from the php > database connection. However, I need to then convert this blob back into a file, else it just looks like encoded text, and offer it to the end client.

In ExtJS all I had to do was get the bytestream of the blob (response.responseBytes), create a blob from that, create a URL for that blob and set the url to a hidden iframe:

var blob = new Blob([result.responseBytes], {type: ‘application/vnd.oasis.opendocument.spreadsheet’});
url = window.URL.createObjectURL(blob);
create iframe
iframe.src = url;

The only problem with implementing this in webix is that I can’t find a way to get the responseBytes from the ajax response.

4

Does this help?

webix.ajax().get(...).then(function (data) {
    data.text()
}

Alternatively, you can use jQuery for AJAX calls. Webix plays nice with jQuery.

5

That’s just a regular ajax call. As I’ve stated, I’m already using those. Getting the text only shows the blob as encoded text, which I do not know how to convert into an actual file, which is my original problem.

As for jQuery, I did not consider it before because so far webix has mostly been enough for my needs but I’ll take a look at it now. Cheers.

6

It is not possible to retrieve blob with current version of webix.ajax

Starting from webix 2.2 you will be able to use

webix.ajax().response("blob").get("patch.zip", function(text, data){
  //data - is a data blob
});

Functionality will not work in IE8-IE9 as they can’t work with blobs at all.

7

Good to know. Is there any ETA for 2.2 or any workaround that you can think of for this (as in, anyway to get the bytestream from the response? I can create a blob from that bytestream, just don’t know how to get at it from the ajax response)

8

2.2 will be released in two weeks,

I can provide a patch for webix_debug.js that will add the new functionality.

9

If there is no other way, then I would appreciate it.

I’ve found this, though: Sending and Receiving Binary Data - Web APIs | MDN

It uses xmlhttprequest, which is parameter of webix’s ajax. If there was a way to define the responseType of xmlhttprequest, then I would probably be able to work out a solution. By default, webix’s xmlhttprequest comes without a type.

10

you can use

webix.attachEvent("onBeforeAjax", function(mode, url, params, xhr){ 
   //xhr.responseType = 
})

But it will not help. Google Chrome will throw an error for any attempt to access of responseText property on such xhr object, so webix.ajax will fail while processing the response.