title: fetch() POST request to Express.js generates empty body {}
body: <p><strong>Goal:</strong> send some defined string data from <strong>HTML</strong> in a <code>fetch()</code> function e.g. "MY DATA"</p>
  
  <hr>
  
  <p>My code:</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;body&gt;
  
  &lt;script type="text/javascript"&gt;
      function fetcher() {
        fetch('/compute',
          {
            method: "POST",
            body: "MY DATA",
            headers: {
              "Content-Type": "application/json"
            }
          }
        )
        .then(function(response) {
          return response.json();
        })
        .then(function(myJson) {
          console.log(myJson);
        });
      }
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>Server.js</strong></p>
  
  <pre><code>var express = require("express");
  var app     = express();
  var compute = require("./compute");
  var bodyParser = require("body-parser");
  
  //not sure what "extended: false" is for
  app.use(bodyParser.urlencoded({ extended: false }));
  
  app.post('/compute', (req, res, next) =&gt; {
      console.log(req.body);
      var result = compute.myfunction(req.body);
      res.status(200).json(result);
  });
  </code></pre>
  
  <p><strong>Currently:</strong> <code>console.log(req.body)</code> logs <code>{}</code></p>
  
  <p><strong>Desired:</strong> <code>console.log(req.body)</code> logs <code>"MY DATA"</code></p>
  
  <p><strong>NOTES:</strong></p>
  
  <ol>
  <li>I also tried sending body in fetch() as <code>body: JSON.stringify({"Data": "MY DATA"})</code> but get the same empty {}</li>
  <li>I either my fetch() request, or my bodyParser(), is not setup correctly.</li>
  </ol>