Javascript XmlHttpRequest Issues

I created a html/javascript website running on an Apache Webserver on Mac OS X. This website consumes a .NET Webservice with JSON via XmlHttpRequest. This Webservice is running on a Windows Vista machine.

The website is accessible with this url: http://macintosh.companyname.local/~username/Sitename/index.html. When I open the website on the Mac with Safari with this url I don't get any JSON data back from the Webservice.

When I open the website with the URL file://Users/username/Sites/Sitename/index.html it works perfectly.

My first thoughts are that is has something to do with XmlHttpRequest and it's security restrictions in many browsers, but I am not sure why it doesn't work when I call the site via the webserver instead of the absolute path to the html file.

Here the code I use to call the Webservice:

<div id="eigenRisico" class="panel" title="Eigen Risico">
<h2>Eigen Risico Per Polis</h2>     
    <script type="text/javascript">         
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "http://webserviceurl/GetEigenRisicoVerzekerde", true);        
    xhr.onreadystatechange = function(){

        if (xhr.readyState === 4) { 
            var result = eval('(' +xhr.responseText+')');           
            var ihtml="";
            var j = 0;
          开发者_如何学编程  for(i = 0; i < result.d.length/2; i++) {
                ihtml=ihtml+"<fieldset><div class='row'><label>Polisnummer:</label><span>"+result.d[j]+"</span></div>";
                j++;
                ihtml=ihtml+"<div class='row'><label>Resterend Eigen Risico:</label><span>&euro "+result.d[j]+"</span></div></fieldset>";
                j++;
            }               
            document.getElementById('eigenRisico').innerHTML = ihtml;
        }
    };
    xhr.setRequestHeader("content-type", "application/json");
    var postData = '{"bsn": "999999999"}';
    xhr.send(postData);
    </script>               
</div>

Does somebody knows why this is happening?

You can't do cross-domain ajax requests

See http://en.wikipedia.org/wiki/Same_origin_policy

You can get around this by setting up a proxy page on your own domain that will take the request and redirect it, then redirect the output back to you.

Are you running PHP? or other server-side processing?

Edit
Just to clarify your original problem, when reading from file://, the security policy is different that from http://. the local resource is considered trusted, and as such the ajax request is allowed to go through. As a web address, it just looks like one website is doing things in your name that maybe it shouldn't.