Node.js新手求助：如何实现POST数据向HTML页面传递

你遇到的核心问题是直接用res.sendFile()无法渲染模板语法，还有个小拼写错误，咱们一步步来搞定：

1. 核心问题：sendFile不解析模板标记 #

你在info.html里用了<%= %>这种嵌入式模板语法（看起来是EJS风格），但res.sendFile()只是单纯把文件原内容发给浏览器，完全不会去解析这些模板标记，所以浏览器会直接显示<%= fistname %>而不是你要的实际值。

2. 具体修复步骤 #

步骤1：安装EJS模板引擎 #

首先在项目根目录运行命令安装EJS：

npm install ejs

步骤2：配置Express使用EJS作为视图引擎 #

在你的服务器代码里添加一行，告诉Express用EJS来处理模板：

const express = require("express");
const bodyParser = require('body-parser');
const app = express();

app.use(express.static("public"));
app.use(bodyParser.urlencoded({ extended: true }));
// 新增：配置视图引擎为EJS
app.set('view engine', 'ejs');

app.get("/", (request, response) => {
  response.sendFile(__dirname + "/views/index.html");
});

步骤3：调整模板文件扩展名 #

把views/info.html改名为views/info.ejs——因为EJS默认会识别.ejs后缀的模板文件。

如果你不想改扩展名，也可以额外配置让EJS解析.html文件：

app.set('view engine', 'html');
app.engine('html', require('ejs').renderFile);

步骤4：用res.render()传递变量并渲染模板 #

修改POST路由里的响应代码，用res.render()替代sendFile，同时修复拼写错误（你写的fistname少了个r，应该是firstname）：

app.post('/sendInfo', (req, res) => {
  try {
    console.log(`firstname: ${req.body.firstname} lastname: ${req.body.lastname}.`);
    const firstName = req.body.firstname, lastName = req.body.lastname;
    // 用render渲染模板，同时传入正确命名的变量
    res.render("info", { firstname: firstName, lastname: lastName });
  } catch (e) {
    console.error("error", e);
    res.status(500).send("服务器错误");
  }
});

步骤5：同步模板里的变量名 #

确保info.ejs里的变量名和你传递的一致：

<html>
<head>
<title>My Site title</title>
</head>
<body>
<h1><%= firstname %></h1>
<h1><%= lastname %></h1>
</body>
</html>

为什么这样能行？ #

• app.set('view engine', 'ejs')让Express明确要用EJS引擎处理视图文件
• res.render()会调用EJS去解析模板里的<%= %>标记，把你传入的变量替换成实际值，再把渲染好的完整HTML发给浏览器

这样调整后，当你提交POST请求，就能在info页面看到正确显示的姓名信息啦~

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