Get Header info in cross domain ajax call

Question

I am trying to validate an image URL if it still holds the image or not by making ajax call to that URL. One problem is the image server is on a different domain so I am using crossDomain:true attribute in my ajax call. Here is what I have tried so far:

function checkFunc(){ $.ajax({ url: 'https://www.google.co.in/images/srpr/logo11w.png', dataType: 'image/png', crossDomain: true, timeout: 5000, error: function(e, status, settings){ alert('ERROR: '+JSON.stringify(e)); }, success: function( e, xhr, settings ) { alert('SUCCESS: '+JSON.stringify(e)); } }); }

But its not working. Also a concern is the images are not confined to a single format, i.e. the image can be png/jpg/gif or any other so I need to have a broader dataType to accept any kind of image.

I have also tried using jsonp, but that gives me error as "Refused to execute script from because its Mime type(image/jpeg) is not executable.

Edit: I cannot run server script from my ajax function which in turn calls the cross domain page, as in php getcontents

"One problem is the image server is on a different domain so I am using crossDomain:true attribute in my ajax call" — crossDomain doesn't do what you think it does. It just disables extra headers that are added for same origin requests in case your same origin request gets redirected to a different origin. — Quentin
– Quentin, Commented Jun 10, 2015 at 13:08
dataType: 'image/png', — dataType doesn't accept a MIME type as a value. — Quentin
– Quentin, Commented Jun 10, 2015 at 13:08
But its not working. — What does that mean? How does the behaviour you get differ from the behaviour expect? — Quentin
– Quentin, Commented Jun 10, 2015 at 13:09
I expect the response to be status 200, but what I get is error block alert — Aakash Jain
– Aakash Jain, Commented Jun 10, 2015 at 13:19
And what does the error say? Make sure you check the JS console in the developer tools. — Quentin
– Quentin, Commented Jun 10, 2015 at 13:20

Prashant Hadole · Accepted Answer · 2017-03-01 12:42:20Z

You can do one thing for that just need to set Access-Control-Allow-Origin & Access-Control-Allow-Headers

 <add name="Access-Control-Allow-Origin" value="*" /> <add name="Access-Control-Allow-Headers" value="Content-Type" />

If you want to allow only for specific domain , you can do that with specific value of domain instead of * value

Leo Bauza · Accepted Answer · 2015-06-10 12:16:49Z

You have to set up the image server to allow cross-origin requests. To do that you need to set the a Header on the server holding the images like this:

Header set Access-Control-Allow-Origin "*"

You can replace the * with your specific domain, in fact you should, otherwise anyone can do a cross-origin request on your image server.

Himesh Aadeshara · Accepted Answer · 2015-06-10 13:05:23Z

The 'xhrFields' property sets additional fields on the XMLHttpRequest.
This can be used to set the 'withCredentials' property.
Set the value to 'true' if you'd like to pass cookies to the server. If this is enabled, your server must respond with the header 'Access-Control-Allow-Credentials: true'.

It may help to you

The question is asking how to read response headers, not set request headers.

Collectives™ on Stack Overflow

Get Header info in cross domain ajax call

3 Answers 3

Comments

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Related