XMLHttpRequest getResponse instead of getResponseText to get arraybuffer data

[Magallo]

Hi all,
I qoute from https://developer.mozilla.org/En/Using_XMLHttpRequest#Handling_binary_data

in javascript is possible, using the The XMLHttpRequest Level 2 Specification adds new responseType attributes which make sending and receiving binary data much easier.

Something like this:
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);  
xhr.requestType = "arraybuffer";   
xhr.onload = function(e)
{  
  var arraybuffer = xhr.response; // not responseText  
  /* ... */  
}  
xhr.send(); 

How to get this in GWT? The class XMLHttpRequest has not a setResponseType(...) method and also has not a getResponse() method to get data, for example, as a byte[] or something similar, but has only a getResponseText() method. Is there a way to solve this?

Thanks.

[Thomas Broyer]

On Monday, June 4, 2012 1:03:40 PM UTC+2, Magallo wrote:

Hi all,
I qoute from https://developer.mozilla.org/En/Using_XMLHttpRequest#Handling_binary_data

in javascript is possible, using the The XMLHttpRequest Level 2 Specification adds new responseType attributes which make sending and receiving binary data much easier.

Something like this:
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);  
xhr.requestType = "arraybuffer";   
xhr.onload = function(e)
{  
  var arraybuffer = xhr.response; // not responseText  
  /* ... */  
}  
xhr.send(); 

How to get this in GWT?

Wait for GWT 2.5: http://code.google.com/p/google-web-toolkit/source/browse/trunk/user/src/com/google/gwt/xhr/client/XMLHttpRequest.java?r=10839 ;-)

 

The class XMLHttpRequest has not a setResponseType(...) method and also has not a getResponse() method to get data, for example, as a byte[] or something similar, but has only a getResponseText() method. Is there a way to solve this?

XMLHttpRequest is a JavaScriptObject, so it's easy to add those: either subclass XMLHttpRequest and then cast() any XMLHttpRequest to your subclass, or use static native helper methods.

[Magallo]

Hi, I tried to use your solution. Looking at Google I/O on youtube (http://www.youtube.com/watch?v=NNmoEOpGJdk) I saw this but I wasn't able to do it.

I tried creating this:

public class BinaryXMLHttpRequest extends XMLHttpRequest
{
    public native JavaScriptObject getResponse()
    /*-
    {
        return this.response;
    }
    -*/;
   
    //Set to "arraybuffer" or "blob" for binary response
    public native void setResponseType(String value)
    /*-
    {
       this.responseType = value;
    }
    -*/;
}

then I used this class this way:

BinaryXMLHttpRequest binxhr = (BinaryXMLHttpRequest)BinaryXMLHttpRequest.create();
binxhr.open("GET", "myservlet_url");
binxhr.setResponseType("arraybuffer");
       
binxhr.setOnReadyStateChange(new ReadyStateChangeHandler()
{
    @Override
     public void onReadyStateChange(XMLHttpRequest xhr)
     {
         BinaryXMLHttpRequest binxhr = (BinaryXMLHttpRequest)xhr;
         if( binxhr.getReadyState() == XMLHttpRequest.DONE )
         {
             binxhr.clearOnReadyStateChange();
             binxhr.getResponse(); => what can I do with this?
         }
    }
});

If you look, at the end I have a binxhr.getResponse(); But this function returna a JavaScriptObject type. What can I do now with this? This is not a byte[] or whatever, so, I don't know in GWT how to manipulate it. Do you have an idea?

[Thomas Broyer]

It will be an ArrayBuffer, so you'd have to build a JSO overlay type representing ArrayBuffer and cast() the JSO to your ArrayBuffer.

But honestly, it'd be easier to compile GWT from trunk and use the API that's already in there. When 2.5 will be out the doors, simply replace your home-built pre-2.5 GWT with the official 2.5.

[Bademus ᵗʰᵉ]

Sorry for resurrecting dead post,
but every time I'm looking  how to implement something gwt'ish I find your answer Thomas, and it always helpful!
Thank you.

[Mail Drafter]

Thomas,

I was wondering if you could advise how one might access the responseURL property that I can see in a Response object in the inspector.

This is the final url from redirects when you access, for example, a google drive image.

One could use these urls as permalinks to their drive images. (Not what Google want I guess).

Ian

[Thomas Broyer]

I'd suggest maybe using XMLHttpRequest directly then; either the one in com.google.gwt.xhr, or the one in Elemental2; and if responseURL is missing (as in com.google.gwt.xhr case), then because it directly maps to the JS object (no encapsulation) you can use JsInterop or JSNI to access the property.