Skip to content
返回博客
在浏览器玩Minecraft,prismarine-web-client完全指南

在浏览器玩Minecraft,prismarine-web-client完全指南

ice
ice
@ice
Updated
2 次浏览
TL;DR:prismarine-web-client是一款开源浏览器版Minecraft客户端,通过WebSocket代理连接至真实服务器。基于mineflayer和prismarine-viewer开发,在Chrome或Firefox中即可运行,无需安装游戏。
<! - gh-polish-start - >
GitHub · Minecraft社区项目

prismarine-web-client (PrismarineJS/prismarine-web-client)

在浏览器中运行的Minecraft网页客户端

在GitHub上Star ↗
⭐ 539颗星💻 JavaScript📄 MIT
<! - gh-polish-end - >

想象过从学校的Chromebook、借用的笔记本电脑或任何未安装游戏的机器上加入Minecraft服务器吗?prismarine-web-client正好解决了这个问题。它在浏览器标签页中运行真实的Minecraft客户端,并可连接到真实的Minecraft服务器,玩家端无需本地安装。

什么是prismarine-web-client

这不是什么简化的2D克隆版本,也不是Flash时代的Minecraft近似品。它是基于两个成熟的PrismarineJS库构建的真实浏览器客户端,mineflayer负责处理Minecraft协议和客户端逻辑,而prismarine-viewer负责渲染3D世界。两者配合使其真正可用。

该项目在GitHub上已获539颗星,采用MIT许可证,这意味着您可以自由使用、Fork和修改。它采用JavaScript编写,这也是它能在浏览器中运行的原因之一。PrismarineJS生态系统已存在多年,为许多社区自动化工具和机器人提供支持,所以这绝非某个周末的实验项目,不存在破损的依赖链。

GitHub Pages上托管了一个实时演示。现在就在桌面上用Chrome或Firefox打开它,无需安装任何东西就能连接到服务器。这是最简单的用法,也是自建之前了解情况的好方式。


技术原理(以及为何如此聪明)

这就开始变得有趣了。Minecraft协议运行在TCP上,而浏览器根本无法打开原始TCP套接字。那么浏览器客户端是如何连接到真实Minecraft服务器的呢?

浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体
浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体

答案是该包在本地运行的代理层。您的浏览器通过WebSocket连接到此代理。代理然后将WebSocket流量转译为TCP,并将所有内容转发到您的目标Minecraft服务器。从服务器的角度来看,这只是另一个正常连接的客户端。它根本不知道您是从浏览器标签页中执行此操作的。

这种架构很聪明,因为客户端代码主要在您的浏览器中运行(mineflayer逻辑、3D渲染),而代理处理浏览器根本无法做到的事情。这是一个清晰的分割。代理是轻量级的,与npm包一起打包,所以无需另外设置任何东西。

值得注意的是,代理需要在某处运行。托管演示在服务器端运行了一个。对于自建,它在您自己的机器上运行。


自行设置

如果您已安装Node.js,整个设置过程大约需要一分钟。全局安装包并启动它:

浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体
浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体
<! - gh-code-start - >
code
npm install -g prismarine-web-client
prismarine-web-client
<! - gh-code-end - >

之后,在浏览器中打开http://localhost:8080。您会看到一个连接屏幕,询问服务器地址和用户名。输入这些信息并点击连接。

在开始之前有几点需要理解。这会在您的本地机器上启动代理服务器。该机器上的任何人都可以通过localhost使用它,但除非您公开端口,否则其他人无法访问。如果您想与同一本地网络上的朋友共享,您需要绑定到您的LAN IP,让他们连接到您的机器地址的8080端口。可行,但需要基本的网络知识。

对于开发或如果您想深入代码,克隆repo并运行:

<! - gh-code-start - >
code
npm install
npm start
<! - gh-code-end - >

这将启动express和webpack的监视模式。保存文件,它会在几秒内重新构建,您刷新以查看更改。该项目还在window对象上公开了一些有用的全局变量用于调试,包括bot、viewer和worldView。如果您打开Chrome DevTools并在控制台中输入bot.chat('test'),您可以直接从那里使用游戏内聊天。对于想了解工作原理的任何人来说,这是一个很好的补充。


目前有效的功能

版本1.6.0很好地处理了探索的核心循环。看,方块渲染正确,运动实时工作,怪物和其他玩家出现,您可以放置和破坏方块。对于休闲探索或无需完整Java客户端的轻度建筑,它真正可用。

浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体
浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体

目前还没有的功能,物品栏管理、箱子和容器、声音以及大多数战斗互动。该项目的路线图将所有这些列为计划中的功能。所以如果您想象的是包含合成、附魔和村民交易的完整生存模式游戏,版本1.6.0不会涵盖这些。

这不是贬低。在浏览器标签页内实时渲染Minecraft世界,连接到实时服务器,在技术上本身就令人印象深刻。"可工作的探索客户端"和"完整的Java客户端对等"之间的差距巨大,他们发布的产品对于他们想做的事情来说是扎实的。

当您已经处于浏览器模式时,一个实用的用途是,如果您遇到不认识的方块,Minecraft.How上的方块搜索工具可用于快速查找,无需切换到另一个应用。


可能绊倒您的事项

版本兼容性是最大的陷阱。prismarine-web-client通过底层的mineflayer层与特定的Minecraft协议版本配合使用。如果您连接的服务器运行的版本不受支持,您将获得一个连接错误,但没有明确的解释。检查项目的GitHub以了解当前版本支持的版本,因为随着PrismarineJS团队更新协议支持,该列表会发生变化。

浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体
浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体

还有其他一些值得提前了解的常见问题:

  • 高级服务器身份验证。 在线模式服务器(针对Mojang/Microsoft验证您的账户的服务器)通过此设置连接会更复杂。演示和大多数自建部署在离线模式服务器上效果最佳,您可以选择任何用户名并直接连接。
  • 繁忙区域的性能。 这是一个在浏览器标签页中运行的真实3D渲染器。密集地形、大量实体和拥挤的服务器会比实体很少的开放区域更明显地推动您的浏览器CPU。
  • 仅限桌面浏览器。 桌面上的Chrome和Firefox是确认的平台。移动浏览器不支持,鉴于控制方案的复杂性和渲染要求,这不会很快推出。
  • 保持代理运行。 如果您自建并且进程死亡,浏览器页面无法连接到任何内容。如果您定期使用,将其设置为持久后台服务是值得额外步骤的。

在尝试之前我有一个错误的假设,我认为这只适用于小型LAN或个人服务器。它连接到代理可以通过TCP到达的任何服务器,包括较大的公共服务器,只要Minecraft版本匹配且身份验证不是阻碍因素。


是否值得您的时间

这完全取决于您需要它做什么。作为一个"无需安装客户端即可在任何地方玩Minecraft"的解决方案,它在当前限制内有效。探索和基本方块互动是真正可用的。完整生存模式,还没有。

浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体
浏览器标签页显示由prismarine-web-client渲染的3D Minecraft世界,包含方块和玩家实体

对于想要从未安装游戏的机器轻松进入其服务器的服务器管理员来说,这实际上很实用。无需启动器,离线模式服务器上无需账户提示,只需打开浏览器并连接。检查构建是否正确或怪物是否正确生成不需要完整的客户端体验。

当您已经在浏览器中时,如果您正在寻找要在服务器上使用的皮肤,Minecraft.How上的皮肤浏览器有大量的收藏值得探索。

值得了解的主要替代品,Eaglercraft是最知名的浏览器Minecraft项目,尽管它有自己的历史和浮动的兼容性问题。对于纯粹的世界查看而无需游玩,prismarine-viewer作为独立库也值得单独了解。而mineflayer是该项目的基础,是为Minecraft机器人脚本而非手动游玩的首选。

对于一个MIT许可的开源项目来说,做这样在技术上有趣的事情,539颗星似乎有点被忽视了。如果使用案例合适,花五分钟尝试是值得的。

<! - gh-polish-start - > <! - gh-polish-end - >