title: Why can't I view the req.body in my POST request?
body: <p>I'm trying to send a username and password from a login through Passport.js. Because passport-local reads the username and password arguments from <code>req.body</code>, I want to make sure that I am properly passing them through the <code>req.body</code> through the client-side.</p>
  <p>When I run the following code, however, I get and empty object in the console:</p>
  <pre><code>router.post('/login', (req, res) =&gt; {
    console.log(req.body)
    res.send()
  })
  </code></pre>
  <p><strong>Can anyone tell me why I am getting an empty object instead of the supplied username and password?</strong></p>
  <p>Here is the React component I am working from:</p>
  <pre><code>import { useState } from 'react';
  
  export const Login = () =&gt; {
    const url = 'http://localhost:3000/auth/login'
    const postLogin = async (username, password) =&gt; {
      await fetch(url, {
      method: 'POST',
      body: JSON.stringify({
        username: username,
        password: password
      })
      })
      .then(data =&gt; console.log(data))
    }
  
    const [username, setUsername] = useState('');
    const [password, setPassword] = useState('');
  
    return (
      &lt;form&gt;
        &lt;div&gt;
          &lt;label htmlFor=&quot;username&quot; &gt;Username:&lt;/label&gt;
          &lt;input 
          type=&quot;text&quot; 
          className=&quot;form-control&quot; 
          id=&quot;username&quot; 
          onInput={e =&gt; setUsername(e.target.value)}
          /&gt;
        &lt;/div&gt;
        &lt;div&gt;
          &lt;label htmlFor=&quot;password&quot;&gt;Password:&lt;/label&gt;
          &lt;input 
          type=&quot;password&quot; 
          className=&quot;form-control&quot; 
          id=&quot;password&quot; 
          onInput={e =&gt; setPassword(e.target.value)}
          /&gt;
        &lt;/div&gt;
        &lt;button type=&quot;button&quot; className=&quot;btn btn-primary&quot; onClick={() =&gt; postLogin(username, password)}&gt;Submit&lt;/button&gt;
      &lt;/form&gt;
    )
  }
  </code></pre>
  <p>Here is the server-side code:</p>
  <pre><code>require('dotenv').config();
  const express = require('express')
  const router = express.Router()
  const session = require('express-session');
  const passport = require(&quot;passport&quot;);
  const bodyParser = require(&quot;body-parser&quot;);
  
  
  const LocalStrategy = require(&quot;passport-local&quot;).Strategy;
  
  router.use(bodyParser.urlencoded({ extended: true }));
  router.use(bodyParser.json());
  
  router.use(session({ 
    secret: process.env.SESSION_SECRET,
    resave: false,
    saveUninitialized: true
  }));
  router.use(passport.initialize())
  
  passport.use('local', new LocalStrategy((username, password, done) =&gt; {
    const authenticated = username === &quot;John&quot; &amp;&amp; password === &quot;Smith&quot;;
  
      if (authenticated) {
        return done(null, { myUser: &quot;user&quot;, myID: 1234 });
      } else {
        return done(null, false);
      }
  }))
  
  router.get('/login', (req, res) =&gt; {
    res.send('test GET /login')
  })
  
  router.post('/login', (req, res) =&gt; {
    console.log(req.body)
    res.send()
  })
  
  module.exports = router;
  </code></pre>
  <p>*Just as a note, the server-side code is still incomplete. I have LocalStrategy filled with dummy-code. I'm just trying to understand this before I keep building it.</p>