如何在带有客户端渲染器的服务器上使用 Matter.js

Question

我正在写一个多人游戏。有没有什么快速的方法可以在服务器上使用 MatterJS（使用nodejs, ws, express）。我的主要问题是将世界从服务器发送到客户端以在画布上渲染它。由于世界困难，有没有什么方法可以Matter.Engine在前端使用内置？
有人可以帮忙吗？

---

如果这个问题有点不详细，请在评论中写下问题。

Answer 1

理想情况下，对于权威服务器游戏，您希望引擎在服务器端运行，而渲染器在客户端运行。Matter.js 为 Engine 和 Render 提供了单独的对象，这很有帮助。

您可以采用以下几种方法：

1. 为服务器端编写您自己的渲染器，它通过 websocket 连接发送更新而不是渲染到屏幕。为客户端编写您自己的引擎对象，该对象从服务器接收 websocket 更新以更新对象位置、角度等，以传递给真正的渲染器。然后，在服务器上，您将运行默认的 Matter.js 引擎，但使用您的自定义渲染器，而在客户端上，您将使用默认的 Matter.js 渲染器，但使用您的自定义引擎。如果您希望采用这种方法，那么 Matter.js 文档将是一个好的开始。

2. 或者，在客户端和服务器上运行默认引擎，但在客户端，将对象设置为静态。不要在服务器端将它们设置为静态。然后，服务器可以向套接字发送更新，其中包括对象 ID、位置和角度。然后客户端可以调用这样的代码来更新客户端引擎：

Matter.Body.setPosition(body, update.position);
Matter.Body.setAngle(body, update.angle); 

方法 #1 需要更多的努力才能开始工作，因为您需要编写客户渲染器和引擎组件，但方法 #2 的效果相当好，可以快速开始工作。要记住的一件事是，在多人在线游戏中，延迟成为一个挑战。在这种情况下，让引擎同时在客户端和服务器上运行可能是一个优势，因为理论上您可以乐观地在客户端应用力/位置，然后在服务器发送下一批更新后“验证”这些更新.

除此之外，该架构可能看起来很像任何其他客户端/服务器游戏架构。

请注意，Matter.js 可以与 NPM 一起安装在 Node 环境中——它不必在浏览器中运行。您可以轻松地将其与 Express.js、ws 或 socket.io 连接起来，然后启动一个循环，您可以在其中调用这样的代码来定期更新引擎：

Matter.Engine.update(engine, 1000 / 60);

希望有帮助。