如何修复 Node.js HTTP 服务器返回空白页面的问题-html教程-PHP中文网

如何修复 Node.js HTTP 服务器返回空白页面的问题

Node.js 原生 http 模块搭建的服务器因响应头中 Content-Type 拼写错误（test/html → text/html），导致浏览器无法正确解析 HTML 内容，最终页面空白。本文将定位问题、给出修正方案，并说明关键注意事项。

node.js 原生 `http` 模块搭建的服务器因响应头中 `content-type` 拼写错误（`test/html` → `text/html`），导致浏览器无法正确解析 html 内容，最终页面空白。本文将定位问题、给出修正方案，并说明关键注意事项。

当你运行一个基于 Node.js 原生 http 模块的简易服务器，并在浏览器中访问 http://localhost:3000 却看到空白页（甚至无任何 HTML 渲染迹象）时，问题往往不出现在逻辑或路由上，而藏在 HTTP 响应头的一个细微拼写错误中。

最典型的错误就是这一行：

res.setHeader('Content-Type', 'test/html'); // ❌ 错误：'test/html' 不是有效 MIME 类型

test/html 是一个不存在的 MIME 类型。浏览器收到该响应头后，会放弃将响应体当作 HTML 解析和渲染，转而可能将其视为纯文本、二进制数据，甚至直接忽略显示——结果就是页面“什么也没收到”。

✅ 正确写法应为：

res.setHeader('Content-Type', 'text/html'); // ✅ 标准 HTML MIME 类型

text/html 是 IANA 官方注册的标准媒体类型（详见 IANA Media Types），明确告知浏览器：“接下来的内容是 HTML 文档，请按 HTML 规范解析并渲染”。

Json Schema Toolkit

使用 JSON Schema 验证 JSON 数据，从示例 JSON 生成 schema，并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。

下载

以下是修复后的完整可运行代码：

const http = require('http');

const server = http.createServer((req, res) => {
  console.log('Request:', req.method, req.url);
  console.log('Headers:', req.headers);

  // ✅ 关键修复：使用正确的 Content-Type
  res.setHeader('Content-Type', 'text/html; charset=utf-8');

  // 更健壮的做法：添加 charset 声明，避免中文乱码
  res.write('');
  res.write('');
  res.write('<meta charset="UTF-8"><title>My First Page</title>');
  res.write('<h1>Hello from my Node.js Server</h1>');
  res.write('');
  res.end();
});

server.listen(3000, () => {
  console.log('Server running at http://localhost:3000');
});

? 额外建议与注意事项：

始终指定 charset=utf-8：在 Content-Type 中显式声明字符集（如 'text/html; charset=utf-8'），可防止中文、特殊符号等出现乱码；
使用：确保浏览器进入标准模式，避免怪异模式（Quirks Mode）导致布局异常；
检查控制台与网络面板：若仍为空白，打开浏览器开发者工具（F12）→ Network 标签页，查看响应状态码（应为 200 OK）、响应头（确认 Content-Type 值）及响应体内容是否完整；
注意 res.end() 必须调用：遗漏此句会导致连接挂起，浏览器持续等待响应结束，表现为加载中或超时。