Same origin policy violated?

Question

Heh,
I'm using jQuery AJAX Call to pull data from a self hosted webservice (same domain), but it always return 0, which indicates a cross domain problem. But this shouldn't be a problem.

Any suggestions how to fix this? Thanks!

Website running my Script

http://www.mysite.com/facebook/el_login   

My AJAX Call:

var data = 'username=' + username.val() + '&password=' + password.val()
$.ajax({  
             url: "http://www.mysite.com/api/v01/account/exists.json",   
             type: "GET",        
             data: data,       
             cache: false,  
             complete: function(transport) {
              if(transport.status == 200) {
                  alert('Success');
              } else {
                  alert('Failed ' + transport.status );
              }
           }

         });  
  })

Firebug Request Headers:

Request Headersview source
Host    www.mysite.com
User-Agent  Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
Accept  */*
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset  ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive  115
Proxy-Connection    keep-alive
Content-Type    application/x-www-form-urlencoded
X-Requested-With    XMLHttpRequest
Referer http://www.mysite.com/facebook/el_login
Cookie  sessionid=xxx

Edit:

Okay, it seems that AJAX Calls on static sites (same server) are working. My Webservice Backend is based on Django, Apache2 and mod_wsgi .. maybe there's a reason why this fails.

Answer 1

For debuggin I use:

function showResponse(responseText, statusText, xhr, $form) {
    debugger; // TODO: Remove in production.
}

and in the ajax call use

error: showResponse

Have you tried using the following parameters:

        dataType: "json",
        contentType: "application/json; charset=utf-8",

Answer 2

Okay, after some hours of Starcraft 2 figured it out.
I wired my Submit Button with

$('#submit').click(function ()

which seem to create some problems with jQuery Ajax

Solution:
Use the "old" style to wire up your ajax call.

<input type="button" value="Submit" id="submit" onClick="sendLogin()"  />

and

function sendLogin() {  
  var query_data = { username:  'test', password:  'test'};

  $.ajax({  
             url: "http://www.mysite.com/api/v01/account/exists.json",   
             type: "POST",        
             data: $.toJSON(query_data),       
          dataType: 'application/json',
          contentType: 'application/json',
             complete: function(transport) {
             if(transport.status == 200) {
                  alert('Success');
              } else {
                  alert('Failed ' + transport.status );
              }
           }
         });  
}