user4504661
user4504661

Reputation: 523

how to get response from node.js-express back to ajax

I am comfortable in PHP but I needed to learn node.js to make my chat application more efficient. I am beginner in node.js and I am currently having the following problem.

What I want to do is to send request to node.js from ajax using jquery and get a response

I was able to do this easy with php but node.js is giving me error. Here is my code so far...

part of HTML

 $(document).on("click", "#nodesess", function () {
        $.ajax({
            type: "POST",
            url: "http://localhost:3000/",
            success: function(data) {
                alert('Success!')
            },
            error: function() {
                alert('error')
            }
        });
     }); 

on the server side

var express = require ('express');
var app= express();

app.get ('/', function(req,res){
    res.send('Hello Express');
    console.log("got get");
});
app.post ('/', function(req,res){
    res.send('Hello Express post');
    console.log("got post");
});

var server = app.listen(3000, function(){
    console.log('listening on port 3000');
});

I have both post and get because I was testing for both. Furthermore, on the cmd i was able to see "got post" or "got get", I was just not able to return the text back to the ajax. Do I need to add Content-Type or I am I doing the whole thing wrong? In php, I would have done POST to a php file and in there I just need to echo. What ever I echoed will be sent back to the ajax....I was thinking res.send will be the same as echo....Help please

I think its important that i mention, the html file and the node.js file are not in the same directory. The Html is actually in the xampp folder and the node is in another directory...Is it even possible to do that?

Upvotes: 1

Views: 2876

Answers (2)

Grizzly Peak Software
Grizzly Peak Software

Reputation: 1418

One thing you could try is to set the dataType option to script/text if you are not expecting JSON results. Also, you might not be using your error callback right. try something like this...

error: function(xhr, error){ console.debug(xhr); console.debug(error); }

Upvotes: 2

user4504661
user4504661

Reputation: 523

-I changed the datatype to script as @gizzlyPeakSoftware commented. It seemed it was working fine at first, since it alerted "Success!". However, when a changed alert('Success!') to alert(data), it alerted undefined.

-I did more research and I found out that the issue was occurring because I was doing cross-domain request since Apache(xampp) and node.js were using different ports. Because of this my jQuery ajax calls get/post were failing silently.

-To address the cross-domain issue I added callback and datatype to my html as follows...

        $.ajax({
                type: "get",
                url: 'http://localhost:3000/',
                dataType: "jsonp",
                jsonpCallback: "_callback",
                success: function(data) {
                    //alert('Success!');
                    alert(data);
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    alert('error ' + textStatus + " " + errorThrown);
                }
            });

I also changed my node.js file to reflect the callback changes

var express = require ('express');
var app= express();

app.get ('/', function(req,res){
    //res.send('Hello Express');
    res.send('_callback(\'{"message": "Hello worldd!"}\')');
    console.log("got get");
});
app.post ('/', function(req,res){
    res.send('_callback(\'{"message": "Hello world!"}\')');
    console.log("got post");
});

var server = app.listen(3000, function(){
    console.log('listening on port 3000');
});

Upvotes: 3

Related Questions