如何构建一个多人(.io) Web 游戏，第 2 部分

在本文中，我们将看看为示例 io 游戏提供支持的 Node.js 后端：

目录 在这篇文章中，我们将讨论以下主题：

服务器入口(Server Entrypoint)：设置 Express 和 socket.io 。

服务端 Game(The Server Game)：管理服务器端游戏状态。

服务端游戏对象(Server Game Objects)：实现玩家和子弹。

碰撞检测(Collision Detection)：查找击中玩家的子弹。

1. 服务器入口(Server Entrypoint)

我们将使用 Express （一种流行的 Node.js Web 框架）为我们的 Web 服务器提供动力。我们的服务器入口文件 src/server/server.js 负责设置：

server.js, Part 1

const express = require('express'); const webpack = require('webpack'); const webpackDevMiddleware = require('webpack-dev-middleware'); const webpackCOnfig= require('../../webpack.dev.js'); // Setup an Express server const app = express(); app.use(express.static('public')); if (process.env.NODE_ENV === 'development') { // Setup Webpack for development const compiler = webpack(webpackConfig); app.use(webpackDevMiddleware(compiler)); } else { // Static serve the dist/ folder in production app.use(express.static('dist')); } // Listen on port const port = process.env.PORT || 3000; const server = app.listen(port); console.log(`Server listening on port ${port}`); 

还记得本系列第 1 部分中讨论 Webpack 吗？这是我们使用 Webpack 配置的地方。我们要么

使用 webpack-dev-middleware 自动重建我们的开发包，或者

静态服务 dist/ 文件夹，Webpack 在生产构建后将在该文件夹中写入我们的文件。

server.js 的另一个主要工作是设置您的 socket.io 服务器，该服务器实际上只是附加到 Express 服务器上：

server.js, Part 2

const socketio = require('socket.io'); const COnstants= require('../shared/constants'); // Setup Express // ... const server = app.listen(port); console.log(`Server listening on port ${port}`); // Setup socket.io const io = socketio(server); // Listen for socket.io connections io.on('connection', socket => { console.log('Player connected!', socket.id); socket.on(Constants.MSG_TYPES.JOIN_GAME, joinGame); socket.on(Constants.MSG_TYPES.INPUT, handleInput); socket.on('disconnect', onDisconnect); }); 

每当成功建立与服务器的 socket.io 连接时，我们都会为新 socket 设置事件处理程序。事件处理程序通过委派给单例 game 对象来处理从客户端收到的消息：

更多：如何构建一个多人(.io) Web 游戏，第 2 部分

我是为少。 微信：uuhells123 。 公众号：黑客下午茶。 谢谢点赞支持！