通过 Express 的静态路由与中间件配置，可将 /page2 映射到 page2.html，同时确保浏览器地址栏始终显示 /page2 而非 /page2.html，无需改用 EJS 或其他模板引擎。
通过 express 的静态路由与中间件配置，可将 `/page2` 映射到 `page2.html`，同时确保浏览器地址栏始终显示 `/page2` 而非 `/page2.html`，无需改用 ejs 或其他模板引擎。
问题根源在于：你当前的路由逻辑是正确的（res.sendFile() 返回 HTML 文件），但用户访问 /page2.html 仍能直接命中文件——这通常是因为启用了 express.static() 且 public/ 目录被设为静态资源根目录，导致 .html 文件被自动暴露。此外，前端 <a></a> 链接若指向 /page2.html（而非 /page2），也会直接触发该路径。
✅ 正确做法分三步：
-
禁用对
.html后缀的直接访问（推荐）
在express.static()之前添加中间件，拦截所有以.html结尾的 GET 请求并重定向为无后缀路径：const path = require('path'); const express = require('express'); const app = express(); // 拦截 .html 请求，301 重定向至 clean URL app.use((req, res, next) => { if (req.method === 'GET' && req.url.endsWith('.html')) { const cleanUrl = req.url.replace(/\.html$/, ''); return res.redirect(301, cleanUrl); } next(); }); // 静态托管（仅服务 /public 下非 HTML 资源，如 CSS/JS/图片） app.use(express.static(path.join(__dirname, 'public'), { extensions: [] // 关键：禁用默认的 'html' fallback，防止自动解析 page2 → page2.html })); // 显式定义页面路由（核心） app.get('/page1', (req, res) => { res.sendFile(path.join(__dirname, 'public', 'page1.html')); }); app.get('/page2', (req, res) => { res.sendFile(path.join(__dirname, 'public', 'page2.html')); }); app.get('/page3', (req, res) => { res.sendFile(path.join(__dirname, 'public', 'page3.html')); }); // 可选：404 处理（避免未定义路径返回空白页） app.use('*', (req, res) => { res.status(404).send('Page not found'); }); -
确保前端链接使用 clean URL
所有超链接必须写为：<a href="/page2">Go to page 2</a>
❌ 不要写成
<a href="/page2.html"></a>—— 否则绕过你的路由逻辑，直接触发静态文件服务或重定向。 -
（进阶）统一处理多页：避免重复路由
使用动态路由提升可维护性：const validPages = ['page1', 'page2', 'page3']; app.get('/:page', (req, res) => { const { page } = req.params; if (!validPages.includes(page)) return res.status(404).send('Not found'); const filePath = path.join(__dirname, 'public', `${page}.html`); res.sendFile(filePath); });
⚠️ 注意事项：
立即学习“前端免费学习笔记（深入）”；
- 不要依赖
express.static({ extensions: ['html'] })，它会启用隐式后缀匹配（如/page2→/page2.html），但无法阻止用户手动访问/page2.html；而显式sendFile+ 重定向策略更可控、语义清晰。 - 若项目后续需 SEO 或服务端渲染，再考虑 EJS/Pug 等模板引擎；纯静态页面场景下，原生 HTML + 正确路由已足够高效简洁。
- 始终检查浏览器开发者工具的 Network 标签页，确认请求路径与响应状态码（应为
200，而非304或301循环）。
这样配置后，用户点击 /page2 链接时，URL 始终保持 localhost:3000/page2，HTML 内容正常加载，且 .html 后缀完全对用户不可见。
