使用 Node.JS 构建的多人 JavaScript 游戏 - 分离玩家 [英] Multiplayer JavaScript game built with Node.JS - Separating players
问题描述
我有一个找不到答案的问题.
I have a question which I cannot find an answer to.
我正在尝试使用 Node.JS 和 Socket.IO 构建多人游戏.我已经建立了一个聊天室作为我的第一个实验，所以我有广播工作等.现在我想用 Canvas 做一些事情.
I'm experimenting with building a multiplayer game with Node.JS and Socket.IO. I have built a chat room as my first experiment, so I have broadcasts working etc. Now I'm at the point where I want to get something working with Canvas.
我遇到的问题是让我的头脑围绕多个独立的玩家.我知道每个玩家都会将他们的 x,y 线发送到服务器，服务器会广播这些线，但是客户端如何知道要显示多少玩家，我猜他们必须存储在某个数组中.
The problem I'm having is getting my head around multiple and independent players. I know that each player will send their x,y cords to the server and the server will broadcast those, but how does the client know how many players to display, I'm guessing they have to be stored in an array somewhere.
推荐答案
我的实现将非常天真和简化，没有滞后补偿、外推等，但它应该指出节点多人游戏"的一般概念.
My implementation will be very naive and simplified, no lag compensation, extrapolation and such, but it should point out a general conception of "multiplayering" with node.
我认为最简单的方法是在客户端和服务器上都有一个包含玩家(实体)的关联数组.然后从客户端发送诸如 {action: "move", target:[32, 100]} 之类的命令，并使用服务器逻辑(实际游戏正在运行的地方)处理此命令.对于每个套接字 on connection，您应该分配一个播放器对象或 ID，以便您可以像这样访问它:
I think the simplest approach is to have an associative array containing players(entities) on both client and server. Then from client side you send commands like {action: "move", target:[32, 100]} and process this command with server logic (where the real game is running). To each socket on connection you should assign a player object or id so you can access it like:
var lastPlayerID = 0;
var players = {};
server.on("connection", function(socket) {
var newcommer = new Player({id: lastPlayerID});
players[lastPlayerID] = newcommer;
socket.player = newcommer; // or lastPlayerID
lastPlayerID++;
socket.onMessage = function(message) {
this.player.doSomething();
}
});
然后假设每个 100 毫秒，您可以向所有连接的玩家发送快照:
Then each let's say 100ms you could send snapshots to all connected players:
{
timestamp: game.delta,
players: {
1: {x: 32, y: 100},
2: {x: 14, y: 11}
}
}
然后在客户端接收数据并从旧值插入到新值.
And then at client side receive data and interpolate from old to new values.
// duration in this simplified example is snapshot sending interval in [ms]
Player.prototype.interpolateTo = function(data, duration) {
if(typeof data.x != "undefined") {
// step needed to get `destination x` within `duration` miliseconds
this.stepValues.x = Math.abs(data.x - this.x) / duration;
this.target.x = data.x;
}
// ...
}
// step you call for each game loop iteration
Player.prototype.step = function(delta) {
if(this.x < this.target.x) {
this.x += delta * this.stepValues.x
}
}
对于最多有 20 个对象的半街机游戏来说，这是一个足够的算法.减少快照的间隔使其几乎适合具有更多对象的策略游戏.您的主要敌人是带宽使用率，您可以减少最小化数据包的大小.例如阅读有关 BiSON、LZW 的内容，并且不要发送自上次快照以来未更改的数据.
This is a sufficient algorithm for a semi-arcade game with 20 objects at maximum. Decreasing snapshot's interval makes it almost suitable for strategy game with more objects. Your main enemy is bandwidth usage which you can decrease minimizing packet's size. For instance read about BiSON, LZW and don't send data which haven't changed since last snapshot.
我的声誉不允许我发布所有链接，所以我将它们附在了这里:http://pastebin.com/Kh3wvF1D
Glenn Fiedler 对多人游戏概念的一般介绍:
General introduction to multiplayer conceptions by Glenn Fiedler:
来自 Quake 的一些多人游戏技巧:这会给你一个关于插值和外推(预测)的线索
Some multiplayer techniques from Quake: This will give u a clue about interpolation and extrapolation(prediction)
http://fabiensanglad.net/quakeSource/quakeSourcePrediction.php
Valve 关于延迟补偿和一般优化的文章:
Valve's article about latency compensation and general optimisations:
帝国时代的多人游戏技巧:
Multiplayer techniques in Age of Empires:
您还可以阅读我关于优化带宽使用的文章
You can also read my article about optimizing bandwidth usage
http://rezoner.net/minimizing-bandwidth-usage-in-html5-games-using-websocket,299
为 Ivo 的 Wetzel Mapple.js +1，这是一大堆知识.
+1 for Ivo's Wetzel Mapple.js it's a big pile of knowledge.
https://github.com/BonsaiDen/Maple.js
这篇关于使用 Node.JS 构建的多人 JavaScript 游戏 - 分离玩家的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
