XHR加载失败：AJAX请求上的POST（在React中）

Question

I don't think React has anything to do with this, but just in case, that's what I'm working in. I'm receiving the error XHR failed loading: POST when submitting an AJAX request to /login. I am trying to create a login route using Passport JS, and I know that the route is receiving the data because it will console.log as { email: 'myemail', password: 'mypassword' } and typeof returns object.

this.handleLoginSubmit = () => {
  let xml = new XMLHttpRequest();

  xml.open("POST", "/login", true);
  xml.setRequestHeader('Content-Type', 'application/json; charset=utf-8');
  xml.send(JSON.stringify({email: this.state.email, password: this.state.password}));

  xml.onreadystatechange = () => {
    if(xml.readyState === 4) {
      console.log('here')
      console.log(xml.response);
    }
  }
}

EDIT Here is the route:

router.post('/login', emailToLowerCase, function(req, res, next) {
passport.authenticate('local', function(err, user, info) {
if (err) {
  console.log('error')
  return next(err);
}
if (!user) {
  return console.log('no user!')
}
req.logIn(user, function(err) {
  if (err) return next(err);
  console.log('logging in')
  return res.send(req.user)
});
})(req, res, next);
});

EDIT Here is the form:

<form id='login-form' className="small-form" className='nav-div' onSubmit={props.handleLoginSubmit}>
<div className='nav-div'>
  <li className="nav-item">
      <input type="email" required name="email" placeholder='Email' className='form-control' value={props.email} onChange={(e) => props.handleEmailChange(e.target.value)}/>
  </li>
  <li className="nav-item">
      <input type="password" required name="password" placeholder='Password' className='form-control' value={props.password} onChange={(e) => props.handlePasswordChange(e.target.value)}/>
  </li>
  <li className='nav-item'>
      <input type='submit' value='Login' />
  </li>
</div>

Answer 1

In your code:

if (!user) {
  return console.log('no user!')
}

You are not sending any response to UI. Not sure how the next(err) processes the response, but at lease in case user is not found you want to send some error back to the client, like:

if (!user) {
  console.log('no user!');
  return res.status( 404 ).json({ message: 'User not found' });
}