Express POST request from React return empty body

Question

Hello, I am working on a react/express app. I've been able to make a GET request from my server, however, I'm having trouble making a POST request. When I do, my server is returning an empty body. I have body-parser as a dependency, accepting json as content, but still no luck with the empty body. My code and dependencies for server/client are below. Please let me know if you guys see something I don't.

Index.js

 const express = require('express');
 const path = require('path');
 const app = express();
 const bodyParser = require('body-parser');

//routes
 require('./routes/sendMessageToEmail')(app);
 require('./routes/helloWorld')(app);

 app.use(bodyParser.json());
 app.use(bodyParser.urlencoded({ extended: true }));

app.use(express.static(path.join(__dirname, 'client/build')));
app.get('*', (req, res) => {
 res.sendFile(path.join(__dirname+'/client/build/index.html'));
});

const port = process.env.PORT || 1111;
app.listen(port);

When I switch the order around of where my routes are declared in my index.js file, for example, declare the routes line after

 app.use(bodyParser.json());
 app.use(bodyParser.urlencoded({ extended: true }));

Line, I get an undefined as oppose to an empty body.

POST Route

   module.exports = app => {
     app.post('/api/message', (req, res) => {
      console.log('>>>>>>>>>> ', req.body);
      res.send(req.body)
     });
    }

My console.log is returning an empty object. I've made the post request in postman, from my browser, curl etc. I'm getting a 200 status response back, however, the body is still empty.

Server package.json

{
  "name": "Blog",
  "version": "1.0.0",
  "engines": {
    "node": "6.11.1"
  },
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "server": "nodemon index.js",
    "client": "npm run start --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "cd client && npm install --only=dev && npm install && npm run build"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.17.2",
    "concurrently": "^3.5.0",
    "express": "^4.15.3"
  }
}

Client Package.json

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^0.16.2",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-iframe": "^1.0.7",
    "react-redux": "^5.0.5",
    "react-router-dom": "^4.1.2",
    "react-scroll": "^1.5.4",
    "redux": "^3.7.2",
    "redux-thunk": "^2.2.0",
    "semantic-ui-react": "^0.71.3"
  },
  "devDependencies": {
    "react-scripts": "1.0.10"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "proxy": "http://localhost:1111/"
}

React POST Route

import axios from 'axios';

const sendToExpress = (input) => {
 return fetch('/api/message', {
   mode: 'no-cors',
   method: 'POST',
   headers: {
   Accept: 'application/json',
   'Content-Type': 'application/json',
   },
   body: JSON.stringify({message: 'asdfafa;k'})
   //body: JSON.stringify({"message": input})
  })
}


//ACTION CREATORS

export const sendInputToServer = (input) => ({
 type: 'SEND_INPUT_TO_SERVER', payload: sendToExpress(input)
});

Any help is appreciated here figuring out why my post request is returning an empty body.

Answer 1

Try to remove this line:

mode: 'no-cors'

Worked for me.