How to return data in a post request in express.js?

Question

Inside my react frontend, I have a handler called handleDrop, the code looks like:

         handleDrop(files) {
          var data = new FormData();

          alert((files[0]) instanceof File);
          files.forEach((file, index) => {
            data.append('file' + index, file);
          });

          fetch('/file_upload', {
            method: 'POST',
            body: data
          }

At my express backend, I have a post handler for this fetch request where I iterate over the uploaded data and figured out the most frequent word. The code looks like:

app.post('/file_upload', function(req , res){
    var dictCount ={};
    var storage = multer.diskStorage({
        destination: mypath
    });
    var upload = multer({
        storage: storage
    }).any();

    upload(req, res, async err => {
      try {
        if (err) {
          console.log(err);
          return res.end('Error');
        } else {
          await bluebird.each(req.files, async item => {
            const data = fs.readFileSync(item.path);

           // figure out the word count here

          var topFeatures = {};

          Object.keys(dictCount).forEach(function(key) {
            console.log(dictCount[key].count);
              if(dictCount[key].count>6){
                  topFeatures[key] = {word:key, count:dictCount[key].count};
              }
          });

          //console.log(topFeatures);
          // how to send top features back to the frontend?
          //res.send({"name":"lol"});
          res.end('File uploaded');

        }
      } catch (e) {
        res.end('Error')
      }
    });
});

My question is: Is there a way to return a json format data containing the most frequent word in this post request so I can do a set state in my react component and update the webpage? Thanks!

https://stackoverflow.com/questions/19696240/proper-way-to-return-json-using-node-or-express — Max Baldwin, Apr 12 '18 at 14:37
@MaxBaldwin Would you mind clarify if I can do something like fetch('file_upload', { post}). then(function(data){ process the data}) Thanks! — Rocking chief, Apr 12 '18 at 15:46
Yes you can put `res.send` at the end of processing your data — Max Baldwin, Apr 12 '18 at 19:37

score 0 · Answer 1 · answered Dec 11 '21 at 13:56

Well I found this answer un answered since ages. A similar answer was answered here --> enter link description here

Short Answer

res.setHeader('Content-Type', 'application/json');
res.send(JSON.stringify({key:"value"}));

or just this

res.json({key:"value"});

app.post('/file_upload', function(req , res){
    var dictCount ={};
    var storage = multer.diskStorage({
        destination: mypath
    });
    var upload = multer({
        storage: storage
    }).any();

    upload(req, res, async err => {
      try {
        if (err) {
          console.log(err);
          return res.end('Error');
        } else {
          await bluebird.each(req.files, async item => {
            const data = fs.readFileSync(item.path);

           // figure out the word count here

          var topFeatures = {};

          Object.keys(dictCount).forEach(function(key) {
            console.log(dictCount[key].count);
              if(dictCount[key].count>6){
                  topFeatures[key] = {word:key, count:dictCount[key].count};
              }
          });
          //Justt stringify it and sent it.
          let topFeaturesRedy = JSON.stringify(topFeatures)
          res.end(JSON.stringify(topFeaturesRedy));

        }
      } catch (e) {
        res.end('Error')
      }
    });
});

How to return data in a post request in express.js?

1 Answers1