Express登录报错TypeError: Cannot read properties of undefined (reading 'username')求助

核心问题分析 #

报错TypeError: Cannot read properties of undefined (reading 'username')本质是req.body为undefined，导致无法读取username属性，主要原因和解决方法如下：

1. 未配置表单数据解析中间件 #

Express框架默认不会自动解析POST请求的表单数据，必须手动配置express.urlencoded中间件。

解决方法：
在你的Express主文件（比如app.js或server.js）中添加以下代码：

const express = require('express');
const app = express();

// 解析application/x-www-form-urlencoded格式的表单数据
app.use(express.urlencoded({ extended: true }));

• extended: true允许解析复杂的嵌套对象，若只需简单键值对，可设为false。

2. HTML表单的语法错误 #

你的登录页面HTML存在两处语法问题，可能导致表单数据无法正常提交：

• 两个input标签的required属性多了一个闭合引号，正确写法是required而非required"
• form标签的闭合位置错误，被提前的</div>截断，导致表单结构不完整

修正后的HTML代码：

<!DOCTYPE html>
<html>
<head>  
</head>
<body>
<div class="login-form">
  <h3>Login Form</h3>
<p><%=(typeof alertMsg!='undefined')? alertMsg:''%></p>
<form method="post" action="/login">
      <input type="text" placeholder="Username" name="username" required>
      <input type="password" placeholder="Password" name="password" required>
       <button type="submit">Login Now</button>
       <a href="/register">New Registration</a>
</form>
</div>

</body>
</html>

3. 路由挂载路径验证 #

确保你的登录路由在主文件中正确挂载，比如：

const loginRouter = require('./routes/login');
app.use('/', loginRouter);

若挂载路径不是根路径，表单的action属性需要对应调整（比如挂载在/users下，action应为/users/login）。

额外建议 #

• 可以在POST路由中先打印req.body，确认数据是否正常接收：

router.post('/login', function(req, res){
    console.log(req.body); // 查看输出是否包含username和password
    var username = req.body?.username; // 使用可选链操作符避免报错
    var password = req.body?.password;
    // ... 后续代码
})

• 密码存储建议使用哈希加密（比如bcrypt），不要明文存储，避免安全风险。

内容的提问来源于stack exchange，提问作者Tấn Lộc