登录时返回net::ERR_EMPTY_RESPONSE：硬编码账号验证跳转异常排查

Let's break down why you're hitting that net::ERR_EMPTY_RESPONSE error and fix it step by step:

1. Your Express backend is mixing incompatible response methods #

In your main.js, you’re using res.writeHead(200, {'Content-Type':'text/html'}) alongside res.send(). Express’s res.send() automatically handles setting status codes and response headers for you—combining these two creates a conflict that leads to incomplete, malformed responses (hence the empty response error).

2. You’re not parsing JSON request bodies #

Your frontend sends JSON data via XMLHttpRequest, but Express doesn’t parse JSON request bodies by default. That means req.body.username and req.body.passw are probably undefined, so your password check fails and you send an empty string back. This makes the frontend try to redirect to an empty URL, worsening the issue.

3. Sending a filename string isn’t the right way to trigger a redirect #

res.send('LoggedIn.html') just sends that string as plain text to the frontend. If you want the backend to handle the redirect, use res.redirect() instead. Alternatively, you can send a success flag and let the frontend handle navigation, but let’s stick with a clean backend-driven flow first.

Fixed main.js code: #

// Add these lines at the top to set up Express properly
const express = require('express');
const app = express();
app.use(express.json()); // Critical for parsing JSON request bodies

app.post('/admin', function (req, res) { 
  const username = req.body.username; 
  const passw = req.body.passw; 
  console.log(`${username} - ${passw}`);

  if (username === 'Admin' && passw === 'Password1') {
    // Redirect directly to the logged-in page
    res.redirect('/LoggedIn.html');
  } else {
    // Send a clear error response instead of an empty string
    res.status(401).send('Invalid credentials');
  }
});

Fixed admin.js code (handles redirects and errors cleanly): #

var myconn = new XMLHttpRequest(); 
myconn.onreadystatechange = function() { 
  if (this.readyState === 4) {
    if (this.status === 200) {
      // The backend handles the redirect, but if you wanted frontend control, use:
      // window.location.href = '/LoggedIn.html';
    } else if (this.status === 401) {
      alert('Invalid username or password');
    } else {
      alert('Something went wrong with the login request');
    }
  }
}; 

function AdminFunction() { 
  const username_ = document.getElementById("id_username").value; 
  const password_ = document.getElementById("id_password").value; 

  // Keep client-side validation (but remember server-side validation is non-negotiable)
  if (username_ === "") {
    alert("Username is empty"); 
    return false;
  } 
  if (password_ === "") {
    alert("Password is empty"); 
    return false;
  } 

  const data = {username: username_, passw: password_}; 
  myconn.open("POST", "http://localhost:8080/admin", true); 
  myconn.setRequestHeader("Content-Type", "application/json;charset=UTF-8"); 
  myconn.send(JSON.stringify(data)); 

  // Prevent the form from doing a full page reload (interferes with AJAX)
  return false;
}

Quick additional tips: #

• Make sure your Express server serves static files like LoggedIn.html and EmployeeLogon.html—add app.use(express.static('public')) (replace 'public' with your static files directory) if you haven’t already.
• Never hardcode credentials in production! Use environment variables or a secure database instead.
• The return false at the end of AdminFunction() is crucial to stop the form from reloading the page, which would break your AJAX flow.

内容的提问来源于stack exchange，提问作者FlyingPotato