title: Not getting request body when using Fetch API but JQuery AJAX works.
body: <p>I am working on a project where </p>
  
  <ol>
  <li>My APIs are written in Express.js (4.16)- in PORT: 1337</li>
  <li>Front end app is in React.js (16.2) - in PORT: 3000</li>
  </ol>
  
  <p>So there are several APIs i need to call from React.js app, the problem am facing is:</p>
  
  <h2>PROBLEM IS -</h2>
  
  <p><strong>DOESN'T WORK  at all- <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch" rel="nofollow noreferrer">fetch() API</a></strong></p>
  
  <pre><code>fetch('localhost:1337/rest/api', {
      body: JSON.stringify( {name: "Sidd", "info": "Lorem ipsum dolor .."} ),
      headers: {
          'Accept': 'application/json, text/plain, */*',
          'Content-Type': 'application/json'
      },
      mode: 'no-cors',
      method: 'post'
  })
  </code></pre>
  
  <p>When am using <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch" rel="nofollow noreferrer">fetch() API</a>, I am not getting the request body in my API defined in Express.js</p>
  
  <pre><code>console.log(req.body) // On logging the request body
  {} // am getting this [empty]
  </code></pre>
  
   <hr>
  
  <p><strong>WORKS- jQuery AJAX</strong></p>
  
  <pre><code>$.ajax('localhost:1337/rest/api', {
      type: 'post',
      data: {name: "Sidd", "info": "Lorem ipsum dolor .."},  
      dataType: 'application/json',
      success: function (data, status, xhr) {
          console.log('status: ' + status + ', data: ' + data);
      },
      error: function (jqXhr, textStatus, errorMessage) {
          console.log('Error' + errorMessage);
      }
  });
  </code></pre>
  
  <p>However am getting <code>No 'Access-Control-Allow-Origin' header is present on the requested resource.</code> ERROR! </p>
  
  <p>But at least am <strong>GETTING</strong> the request body in my API in this case. Also tested my APIs through POSTMAN and they work totally fine.
  I have seen all the discussions out there online but nothing works. </p>
  
  <p>Oh! I would also like to add this - In my Express.js setup am using body-parser properly </p>
  
  <pre><code>app.use(bodyParser.json({limit: '2mb'}));                           // 2mb file upload limit
  app.use(bodyParser.urlencoded({limit: '2mb', extended: true}));     // 2mb file upload limit
  </code></pre>
  
  <h2>WHAT I WANT!</h2>
  
  <ol>
  <li>Solution for fetch() API</li>
  <li>If NOT fetch() API, how to remove the <code>No 'Access-Control-Allow-Origin'</code> error from my jQuery Ajax call.</li>
  <li>What am I doing wrong?</li>
  </ol>
  
  <p>Thanks guys!</p>