How to make a CORS Request with Javascript

Question

I am trying to make a code that automaticlly fills in a form based on information given on an other server. To be precisely: http://services.runescape.com/m=hiscore/index_lite.ws?player=playername

This was my code:

var name = document.form.name.value;
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
    alert(xmlhttp.responseXML);
}
xmlhttp.open("GET","http://services.runescape.com/m=hiscore/index_lite.ws?player="+name,true);
xmlhttp.send();

But Firefox always showed this error:

Cross-origin request blocked: The Same origin policy forbids to read the external resource on http://services.runescape.com/m=hiscore/index_lite.ws?player=drumgun. This can be solved by moving the re source to the same domain or activating CORS.

There may be some grammar mistakes because I translated it from German.

Then I tried using the same headers Firefox uses:

var name = document.form.name.value;
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
    alert(xmlhttp.responseXML);
}
xmlhttp.open("GET","http://services.runescape.com/m=hiscore/index_lite.ws?player="+name,true);
xmlhttp.setRequestHeader("User-Agent","Mozilla/5.0 (Windows NT 6.1; WOW64; rv:34.0) Gecko/20100101 Firefox/34.0");
xmlhttp.setRequestHeader("Host","services.runescape.com");
xmlhttp.setRequestHeader("DNT","1");
xmlhttp.setRequestHeader("Connection","keep-alive");
xmlhttp.setRequestHeader("Accept-Language","de,en-US;q=0.7,en;q=0.3");
xmlhttp.setRequestHeader("Accept-Encoding","gzip,deflate");
xmlhttp.setRequestHeader("Accept","text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8");
xmlhttp.send();

But the same error occured.. I hope you can help me.

There's nothing you can do clientside, CORS has to be enabled on the server, not in the clients browser — adeneo, Jan 04 '15 at 22:38
Really? I know websites that use information from that website. Could the headers be the problem? Or does it make a difference if they use somethingelse? like PHP? Nevertheless thank you for your response — , Jan 04 '15 at 22:57

score 1 · Answer 1 · answered Jan 04 '15 at 22:45

XlmHttpRequest only works across domains if cross-origin resource sharing (CORS) is enabled. If you have control over the server, this is how you enable it: http://enable-cors.org/server.html

If you don't have control over the server, then you are out of luck. You might be able to fetch the information via a normal script include if they support JSONP.

A third option, which requires your own server again, would be to set up a proxy that is on your own domain, which then gets the relevant data for you. Since only the browser is limited by CORS, you can fetch the data with your favirote programming language on the server an pass it along

How to make a CORS Request with Javascript

1 Answers1