Call a external web page (cross-domain) with javascript

Question

I'm trying to validate a feed, using the web service that is in this question.

But browser does not allow me to send a ajax GET request to another server. And there is a one second restriction per each request in that web service, so I can't mirror requests from my server.

This is my current jQuery code:

var reqUrl = "http://validator.w3.org/feed/check.cgi?url=" + encodeURIComponent(theUrl);
$.get(reqUrl, function(data) {
    // do something
});

Isn't there any other way?

score 2 · Answer 1 · edited May 23 '17 at 11:56

2

I searched google and found this. the third answer says that:

In computing, the same origin policy is an important security concept for a number of browser-side programming languages, such as JavaScript. The policy permits scripts running on pages originating from the same site to access each other's methods and properties with no specific restrictions, but prevents access to most methods and properties across pages on different sites.(source)

you'd better see the answers of this question.

I think you can't use JSONP because you haven't any access to W3C script.

Update (explanations)

I the question I linked to there is another way that I can explain it to you. if you set Access-Control-Allow-Origin header to * as the answer said you can send requests to another domains. and to use it easily in an MVC application you can see this solution. Good luck

Update2

to allow just http://validator.w3.org/ you just should set Access-Control-Allow-Origin to http://validator.w3.org/

for more details as answer said go here.

edited May 23 '17 at 11:56

Community

1
1

answered Aug 17 '12 at 00:28

ahmadali shafiee

4,350
12
56
91

@MahdiGhiasi It was a wrong! I edited it and also I added a solution! – ahmadali shafiee Aug 17 '12 at 00:35
In the page you linked to, there is solution that refers to http headers, but I can't understand it. Do you know what is it? – Mahdi Ghiasi Aug 17 '12 at 00:39
@MahdiGhiasi I explained it in the last paragraph of my answer. – ahmadali shafiee Aug 17 '12 at 00:49
In your second update, `http://validator.w3.org/` would have to allow his site access not the other way around. By the way this option is called [CORS](http://en.wikipedia.org/wiki/Cross-origin_resource_sharing) (Cross Origin Resource Sharing). – Josh Mein Aug 17 '12 at 01:50

score 2 · Accepted Answer · edited May 23 '17 at 11:50

2

Ajax calls are not valid across different domains unless you use JSONP. JQuery-ajax-cross-domain is a similar question that may give you some insight. Also as noted by Luis in the comments, JSONP has to also be implemented on the domain that you are getting the data from.

Here is an example for jquery ajax(), but you may want to look into $.getJSON():

$.ajax({
    url: 'http://yourUrl?callback=?',
    dataType: 'jsonp',
    success: processJSON
});

Another option is CORS (Cross Origin Resource Sharing), however, this requires that the other server to enable CORS which most likely will not happen in this case.

edited May 23 '17 at 11:50

Community

1
1

answered Aug 17 '12 at 00:28

Josh Mein

28,107
15
76
87

I'll wait for your example :) – Mahdi Ghiasi Aug 17 '12 at 00:28
But as you can see, it is w3 server, and I can't implement JSONP in their server. Do they implemented JSONP on their servers? – Mahdi Ghiasi Aug 17 '12 at 00:41
You may just have to try JSONP to see if it works; that is probably the only way to find out. – Josh Mein Aug 17 '12 at 00:50

Luis · Answer 3 · 2012-08-17T00:56:59.703

1

As said you can use JSONP but the endpoint must also implement it, And its only used if you are requesting json data from the call. It looks like you are retrieving html.

You can also implement a simple proxy in your domain that pulls the data from the external location and serves it to the ajax call. You can develop a simple proxy in php using for instance CURL.

Make sure you understand the implications of this security wise making sure for instance that you protect your proxy to only make calls to that external url (whitelisting).

Update: I just noticed you cannot use the proxy solution. And after following the link you have suggested I have came across CORS, which I didnt event know about. So apparentry you can set some headers when you are serving the pages in your domain that will instruct the browser that requests to some domains can be done.

Check this page for how to implement it:

http://enable-cors.org/

I have read that you might have to tweak it a bit to work with IE but it seems that all browsers are now implementing it.

edited Aug 17 '12 at 00:56

answered Aug 17 '12 at 00:35

Luis

5,979
2
31
51

Please read my question: *...And there is a one second restriction per each request in that web service, so I can't mirror requests from my server.* – Mahdi Ghiasi Aug 17 '12 at 00:37
In the page that ahmadalishafiee linked in his answer, there is something about a solution with http headers. Do you know what is it and how to use it? – Mahdi Ghiasi Aug 17 '12 at 00:39
I have enabled that header (and tested it in web-sniffer.net) but my code still not working... http://azinium.com/test.html Can you please tell me, what is wrong with my code? – Mahdi Ghiasi Aug 17 '12 at 01:06
My server should have this http header, or w3 server? This is the javascript error that I found in Google Chrome inspect element: XMLHttpRequest cannot load http://validator.w3.org/feed/check.cgi?url=1pezeshk.com. Origin http://azinium.com is not allowed by Access-Control-Allow-Origin. – Mahdi Ghiasi Aug 17 '12 at 01:28

score 0 · Answer 4 · answered Feb 25 '15 at 14:59

I know this is an old question, but I myself have been trying to create AJAX requests to validator.w3.org as well, hit the exact same issues and stumbled on this SO question.

However, I did find a solution;

As people have already stated, the main problem here is that the server must issue valid CORS headers, i.e.

Access-Control-Allow-Origin: *

I used Fiddler to check the response headers from validator.w3.org and sure enough, the headers were not set. However, they also have another tool that does at validator.w3.org/nu/.

Here is an example: http://codepen.io/DDN-Shep/pen/ogdGgO/

$('form').on('submit', function(e) {
  e.preventDefault();

  var data = new FormData(this);

  $.ajax({
    url: 'http://validator.w3.org/nu/', // Trailing '/' is important or you get a 301 HTTP response status code
    type: 'POST',
    data: data,
    processData: false, // Required for jQuery & FormData
    contentType: false, // Set by FormData, required by the server
    success: function(data, status, xhr) { /* TODO */ },
    error: function(xhr, status, error) { /* TODO */ },
    complete: function(xhr, status) { /* TODO */ }
  });
});

If you are ever unsure whether or not a server allows CORS, you can use this very helpful online tool;

test-cors.org = http://client.cors-api.appspot.com/client

Call a external web page (cross-domain) with javascript

4 Answers4

Linked