如何让Express+WebSocket服务器根路径直接显示board.html？

问题场景 #

使用Express.js和WebSockets开发双人游戏，目录结构如下：

.
├── public
│   ├── board.html
│   ├── board.js
│   ├── chess.css
│   └── util.js
├── server
│   ├── game.js
│   ├── node_modules
│   ├── package.json
│   ├── package-lock.json
│   └── server.js
└── todo.md

启动node ./server/server.js后，服务器监听8000端口，但访问localhost:8000时页面空白，必须访问localhost:8000/board.html才能显示主页面，需要实现根路径直接加载board.html。

当前server.js核心代码片段：

const app = express();
app.use('/', express.static(`${__dirname}/../public/`));
app.use(cookieParser) // 注意：此处缺少括号，应改为cookieParser()

解决方法 #

方法1：修改static中间件的默认首页配置 #

Express的express.static中间件默认会查找目录下的index.html作为首页，只需指定index选项为board.html即可：

app.use('/', express.static(`${__dirname}/../public/`, {
  index: 'board.html'
}));

方法2：添加根路径路由处理 #

如果需要更灵活的控制（比如根据条件跳转），可以直接给根路径/添加路由：

方案A：重定向到board.html

app.get('/', (req, res) => {
  res.redirect('/board.html');
});

方案B：直接返回board.html文件

app.get('/', (req, res) => {
  res.sendFile(`${__dirname}/../public/board.html`);
});

注意：两种方法任选其一即可，推荐方法1，更符合静态资源服务的设计逻辑。另外别忘了修正cookieParser的调用，添加括号：app.use(cookieParser())，避免后续可能出现的中间件错误。

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