0

I'm trying to send an ajax call. I used a REST test extension for Chrome called Postman [Link to it]. When I send the call with the extension it works, but when I send it via jQuery it doesn't work and I get as an error message: "error 0".

This is the request that the Postman tool sends to the server:

POST /form/front HTTP/1.1
Host: go.com
Cache-Control: no-cache

{ "sitename": "AAGx", "zone": 12, "sector": 34, "square": 7} 

This is my code to send a request to the server:

function insert_newform() {
    form_data = {sitename: 'AAGx', zone: 12, sector: 34, square: 7}
    $.ajax({
            type: "POST",
            url: 'http://go.com/form/front', 
            data: JSON.stringify(form_data),
            success: function(result) { alert("good!") },
            error: function(jqXHR, textStatus, errorThrown) { alert(textStatus) }
    });
}

$("#show").click(function() {
        insert_newform()
    }
    );

I am unable to find out what's wrong with my call!

EDIT: go.com is just an example!

EDIT2: I'm going crazy.

Edit3: I updated my code to add JSON.stringify()

Edit4: when I put the files on the server and run the script it works great and everything is fine! But when I run the files locally on my machine, then the calls don't work and I get that error. I'm really going crazy! I can't figure out what's wrong :(

Edit5: maybe this has to do with this thing called CORS? But how does it come that it works from the Chrome Plugin but it doesn't work from my scripts locally?!!

Jack Twain
  • 6,273
  • 15
  • 67
  • 107

2 Answers2

2

If your data property is a JavaScript object, jQuery converts it to form data for transmission. It's possible that Postman is sending it as an actual string. Try wrapping your data in single quotes:

data: '{"sitename": "AAGx", "zone": 12, "sector": 34, "square": 7}', ...

Edit: In response to your edits, I can almost guarantee you it is a CORS, or cross-origin resource sharing, issue. AJAX and JavaScript in general are subject to various security constraints. One of the most central security concepts that limits the abilities of JavaScript is the Same Origin Policy. The idea is to prevent XSS (cross-site scripting) attacks.

jQuery's AJAX function will give an error code of 0 if it experiences CORS issues.

There's a detailed answer about how local files are under more strict security constraints here that explains your situation perfectly.

Your solutions are to send the Access-Control-Allow-Origin header from the server, if you have control of the server. Otherwise, you can try using JSONP which does not use the XMLHTTPRequest object and is not subject to those same security constraints.

Community
  • 1
  • 1
Alex W
  • 37,233
  • 13
  • 109
  • 109
  • I already wrapped my object with JSON.stringify() but this is not the problem. Because when I run the code on the server everything works fine. But when I run it locally then it fails and I get that error. – Jack Twain Oct 17 '14 at 21:23
-1

The host go.com does not allow XSS/CORS from your domain.

XMLHttpRequest cannot load http://go.com/form/front. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://stackoverflow.com' is therefore not allowed access.
Alex W
  • 37,233
  • 13
  • 109
  • 109
gmreburn
  • 313
  • 1
  • 5