Not getting Response from ajax , getting into error function

Question

I am working with ajax and node js for the first time. When I use the client to get response from node js it gets into the error function. On the other hand, when I directly call the url from the browser, I get the correct response from the server. This is an indication that something is wrong with the client side ajax request.

This is my client code :

function fetch() {
    $.ajax({
    type: 'POST',
    url: "http://127.0.0.1:8888",
    data: {data : 'India'},
    dataType: 'json',
    success: function () {
        alert("hi");
        //var ret = jQuery.parseJSON(data);
        //$('#q').html(ret.msg);
    },
    error: function (jqXHR, textStatus, error) {
        console.log('Error: ' + error.message);

        alert("ERROR");
    }

});

This is the server node.js code (part of it). The console.log msg get the correct values.

http.createServer(function(req, response) {  
    console.log("Request received");
    response.writeHeader(200, {"Content-Type": "application/json"}); 
    req.on('data', function (chunk) {
        console.log(chunk.toString('utf8'));
        console.log(result[0].name);

    });     
    response.end(JSON.stringify({data:result}));
}).listen(8888);

All the console.log in the server gets the correct values. That means the response is not reaching back when there is ajax request, but on directly writing 127.0.0.1:8888, I get correct response.

The message on the console is :

XMLHttpRequest cannot load http://127.0.0.1:8888/. Origin null is not allowed by Access-Control-Allow-Origin.

Please someone help to fix this out. I have been on this for a day now.

EDIT : Screen capture of the network tab. As you can see the server gets the request but the client does not get the response. This is done even after writing 'Access-Control-Allow-Origin' : '*'. enter image description here

Are you getting output in the *browser* console? Sounds like a cross-domain issue to me. — Dave, Aug 04 '13 at 20:22
@Dave: I see this message(edited post) and then the alert message pops up . Then the page automatically reloads. — Wayne Rooney, Aug 04 '13 at 20:26
Yes, then it is the issue I linked to. This is a very common problem, caused by the sandboxing browsers apply (one domain can't get details from another, unless the other allows it). I'm not sure if any permissions will allow it to work with a filesystem (null) script, so you might need to set up a localhost or host your file somewhere. — Dave, Aug 04 '13 at 20:29
possible duplicate of [JQuery ajax cross domain](http://stackoverflow.com/questions/3506208/jquery-ajax-cross-domain) — Dave, Aug 04 '13 at 20:29
You can start chrome with a flag to permit cross domain requests. See - http://stackoverflow.com/questions/3102819/chrome-disable-same-origin-policy — levi, Aug 04 '13 at 22:23
@Dave: I have moved into into web server (http) and also added response.writeHeader(200, {'Content-Type': 'application/json','Access-Control-Allow-Origin' : '*'}); . Still I get the error, and the console says ->error :undefined — Wayne Rooney, Aug 05 '13 at 12:20

score 2 · Accepted Answer · answered Aug 04 '13 at 20:33

2

This is the Same Origin Policy. You need to supply the HTML document hosting the JavaScript over HTTP (and, unless you are using CORS, from the same hostname and port as the resource you are requesting with Ajax).

answered Aug 04 '13 at 20:33

Quentin

914,110
126
1,211
1,335

I included this line (response.writeHeader("Access-Control-Allow-Origin", "*");) in the server , and also moved from file to http, still the error is there and the page reloads . – Wayne Rooney Aug 04 '13 at 20:54
Amazingly, I added the ajax in the document.ready funtion and it worked :) . Thank You. – Wayne Rooney Aug 05 '13 at 13:53

Not getting Response from ajax , getting into error function

1 Answers1