XMLHTTPRequest returns null in response [duplicate]

Question

Possible Duplicate:
Getting BLOB data from XHR request

I try to get an image from my server dynamically, but the XMLHTTPRequest returns null in the response. The Google Chrome network tool tells me that he loaded the day1.jpg, but the blob variable is null...

var xhr = new XMLHttpRequest(), blob;

xhr.open("GET", "day1.jpg", true);

// Set the responseType to blob
xhr.responseType = "blob";

xhr.addEventListener("load", function () {
    if (xhr.status === 200) {
        console.log("Image retrieved");
        blob = xhr.response;
        console.log("blob: " + blob);
    }
}, false);

// Send XHR
xhr.send();

The output is:

Image retrieved
blob: null

If its returning status code 200 and actually running there shouldn't be an issue. Try putting console.log("blob: " + xhr.response) for grins. — Snuffleupagus
– Snuffleupagus, Commented Mar 5, 2012 at 17:54
blob = xhr.response; console.log("blob: " + blob); is exactly the same as console.log("blob: " + xhr.response) — Franziskus Karsunke
– Franziskus Karsunke, Commented Mar 5, 2012 at 19:19
should be exactly the same, just like the code above should be working. ;p — Snuffleupagus
– Snuffleupagus, Commented Mar 5, 2012 at 19:21

Nisse Engström · Accepted Answer · 2018-07-24 06:16:06Z

4

The reason is a bug on the Chrome side (also available on v18). Reported here

edited Jul 24, 2018 at 6:16

Nisse Engström

4,77323 gold badges29 silver badges44 bronze badges

answered Mar 5, 2012 at 18:29

Zuuum

1,48511 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Franziskus Karsunke Over a year ago

html5rocks.com/en/tutorials/file/xhr2 <-- Here you can see the workaround.

scrappedcola · Accepted Answer · 2012-03-05 18:06:20Z

1

why use ajax to load the image (as far as I know you can't http://www.mail-archive.com/[email protected]/msg00377.html)? You can just dynamically generate an image element and set the src attribute to the image on your server.

var i = new Image();
i.onload = function()
{
   //do the stuff you need to do once it loads here
}
i.src = "day1.jpg";

answered Mar 5, 2012 at 18:06

scrappedcola

10.6k1 gold badge36 silver badges48 bronze badges

1 Comment

Franziskus Karsunke Over a year ago

It is possible with HTML5. And I want to load a pdf file in the end.

Andrew Hall · Accepted Answer · 2012-03-05 17:50:33Z

0

Use the console to inspect the xhr object and see if it's being populated at all

answered Mar 5, 2012 at 17:50

Andrew Hall

3,08323 silver badges30 bronze badges

3 Comments

Franziskus Karsunke Over a year ago

If the handler is called and Google Chrome tells me it is loaded, why shouldn't it be populated?

Andrew Hall Over a year ago

Try it and see what is populated in the object then.

Franziskus Karsunke Over a year ago

The response is null, the status 200, the readyState 4 and everything is null. But I already told that in my question...

Abhidev · Accepted Answer · 2012-03-05 18:00:40Z

-1

I doubt that you can load images from the server dynamically, instead what you can do is update the image source dynamically and tell from whci location shoul the image be fetched/loaded

answered Mar 5, 2012 at 18:00

Abhidev

7,3036 gold badges23 silver badges26 bronze badges

2 Comments

Snuffleupagus Over a year ago

Why wouldn't he be able to? All it does it call a simple GET request (exactly like a browser would do if you typed in the URL) and returns the response (the image).

Abhidev Over a year ago

and how is he supposed to use the returned data???

Collectives™ on Stack Overflow

XMLHTTPRequest returns null in response [duplicate]

4 Answers 4

1 Comment

1 Comment

3 Comments

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

3 Comments

2 Comments

Linked

Related