res.send不能正常工作

Question

I am working with a simple CRUD app with jquery ajax and node.js, just to improve my skills with node and ajax. The thing is that I am doing a post request that is handled with my post router in the node server, and everything is working fine. It adds 1 more product to my products.json file, but in the end it doesn't send the response back to the client, the final res.send("done") doesn't work and I don't know why..

here is the code:

ajax

$("#create-form").on('submit',function(){
    event.preventDefault();
    var createIn = $("#create-input").val();
    $.ajax({
        url: '/products',
        method:'POST',
        data:JSON.stringify({name:createIn}),
        contentType: "application/json",
        dataType: "json",
        success: function(data){
          console.log(data);
          $("create-input").val("");
          $("get-button").click(); 
        }
    });
})

node

app.post('/products',function(req,res){
    fs.readFile('products.json','utf8',function(err,data){
        var result = JSON.parse(data);
        var productName = req.body.name;
        console.log(req.body.name);
        currentId++;
        var productId = currentId;
        var product = {
            name: productName,
            id: productId
        }
        result.products.push(product);
        fs.writeFile(__dirname + "/products.json",JSON.stringify(result),'utf8');
     });
    res.send("post done");
});

This is just the important part of the code, it works and just fails at the end in the res.send.

Answer 1

This does not answer your question directly but you should ideally not send back the response until you know the work has been done, and you should handle errors. In other words you should use the callbacks. (Too many callbacks can be problematic and you should investigate other patterns - eg promises - bit no need here)

app.post('/products',function(req,res){
    fs.readFile('products.json','utf8',function(err,data){
        if (err) return res.send("error");
        var result = JSON.parse(data);
        var productName = req.body.name;
        console.log(req.body.name);
        currentId++;
        var productId = currentId;
        var product = {
            name: productName,
            id: productId
        }
        result.products.push(product);
        fs.writeFile(__dirname + "/products.json",JSON.stringify(result),'utf8', function(err, res) {
         if (err) return res.send("error");
         res.send("post done");
        });
     });

});

Answer 2

Your client code is looking for a json response, but you are returning a string.

$("#create-form").on('submit',function(){
    event.preventDefault();
    var createIn = $("#create-input").val();
    $.ajax({
        url: '/products',
        method:'POST',
        data:JSON.stringify({name:createIn}),
        contentType: "application/json",
        dataType: "json",           <--------------
        success: function(data){
          console.log(data);
          $("create-input").val("");
          $("get-button").click(); 
        }
    });
})

Either delete this line or add on the server side

res.send({"message":"post done"});