Get remote json data using local html file (using javascript - jquery)

Question

Hi, I'm just making a small utility with a local html file (checker.htm) with JavaScript(using jquery) on my desktop that requests data from my website every 10 mins. if it finds it then does nothing. else alerts me.

The problem i'm facing is : I can't seem to use either POST/GET from the local htm file c:\checker.htm :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
$.post("http://www.mysite.com/st/prod_json.php?products_id=15",{},function(data){alert(data);},"text");
});
</script>

I've tried using post/get and with the options : "text"/"json" -- all with the same result : Only a blank popup.

My best Guess is this a javascript permission issue.. (?)

Do you know any workaround?

Answer 1

Same Domain Origin Policy. One workaround is to write a server side script hosted on the same domain and serving as a proxy to the distant domain. IMHO using pure javascript it is impossible to achieve.

Answer 2

You have to use a relative URL for $.post(). Otherwise the browsers will refuse to make the AJAX request in order to prevent cross-site scripting.

There was a related question earlier today: "Ajax get an XML file", in which the answers describe some possible workarounds.

Answer 3

If you're trying to get data from a different domain you'll need to use JSONP to receive it.

Answer 4

Here is a perfect tut: http://www.youtube.com/watch?v=F5pXxS0y4bg