1

我正在使用 Canvas 和 MySQL 数据库在 PHP 中开发多人游戏。两名玩家加入游戏,他们首先获得对手的位置(X,Y 和角度)。

当他们准备好时,游戏开始。游戏算法是这样的。
每 50 毫秒

  1. 计算自己的位置 (X,Y)
  2. 获取对手的角度(AJAX)并计算对手的位置(X2,Y2)
  3. 然后在 Canvas 上绘制并更新数据库。

    context.fillStyle = "green";
    context.fillRect(p1.x,p1.y, 5,5);
    addPoints(p1.x,p1.y);
    updateRoundJQ(p1.x,p1.y,p1.a);
    
    context.fillStyle = "red";
    context.fillRect(x2,y2, 5,5);
    addPoints(x2,y2);
    
    loopTimer = setTimeout('drawLine()', 50);
    

但不幸的是,我得到了这个结果。接收数据有很大延迟。谁能帮助我如何摆脱这个巨大的错误?真的会很感激。

玩家 1 的屏幕 播放器 1 合一电脑

玩家 2 的画面 玩家 2

4

2 回答 2

4

您的脚本不是每 50 毫秒运行一次 - 因为它只是在所有其他功能都运行后才设置超时。根据updateRound工作方式,这可能会将往返时间添加到每个间隔。

例如,考虑以下时间:

context.fillStyle = "green"; // 1ms
context.fillRect(p1.x,p1.y, 5,5); // 1ms
addPoints(p1.x,p1.y); // 1ms
updateRoundJQ(p1.x,p1.y,p1.a); // web request? 300ms

context.fillStyle = "red"; // 1ms
context.fillRect(x2,y2, 5,5); // 1ms
addPoints(x2,y2); // 1ms

loopTimer = setTimeout('drawLine()', 50); // wait 50ms from now

因此,使用这些示例计时,您的循环将仅在 ~306 毫秒后运行。

可能值得考虑使用 websocket 将数据推送到您的客户端,而不是使用 AJAX 拉取数据。

于 2013-01-19T22:52:19.833 回答
1

我终于找到了使用Node.JSSocket.IO的解决方案。该解决方案将比在 AJAX 中简单得多。

  //Client Side Request   
  function sendMyPoints(){
       socket.emit('myPoints',p1.x,p1.y);
  }

  //Server Handles the Request 
  socket.on('myPoints',function(xP, yP){
    socket.broadcast.emit('getOppPoints',xP,yP);
  });

  //Client gets the Response
  socket.on('getOppPoints',function(xPos,yPos){
      drawOppPoints(xPos, yPos);
  });

感谢您推荐 Websocket。这很棒。

于 2013-01-20T22:50:24.963 回答