浏览器 (WebAssembly)

简介

你可以用 Bevy 制作网页浏览器游戏。这一章将帮助你了解如何做到这一点所需要知道的细节。本页是对 Bevy 支持浏览器的概述。

你的 Bevy 应用程序将被编译为 WebAssembly(WASM),这使得它可以被嵌入到网页中并在浏览器中运行。

性能将受到限制,因为 WebAssembly 比原生代码慢,目前不支持多线程。

并非所有的第三方插件都兼容浏览器。如果你需要额外的非官方插件,你必须检查它们是否与 WASM 兼容。

项目设置

同样的 Bevy 项目,无需任何特殊的代码修改,就可以为网页平台或桌面原生平台构建程序。

然而,你需要一个带有一些 HTML 和 JavaScript 的"网站"来加载和运行你的游戏。这可能算是为了开发和测试所做的一个最小的改动。它可以很容易地自动生成。

为了部署,需要一个服务器来托管你的网站,供其他人访问。你可以使用 GitHub 的托管服务:GitHub Pages

其他注意事项

当用户加载你的网站来玩你的游戏时,他们的浏览器将需要下载文件。优化大小是很重要的,这样你的游戏可以快速加载,不浪费数据带宽。

还需要一些少量的额外配置才可以正常查看 Rust 崩溃信息

快速开始

首先,在你的 Rust 安装组件中添加对 WASM 的支持。通过 Rustup:

rustup target install wasm32-unknown-unknown

接下来,要在浏览器中运行你的 Bevy 项目。

wasm-server-runner

最简单和最自动的方法是使用 wasm-server-runner 工具。

安装它:

cargo install wasm-server-runner

.cargo/config.toml(在你的项目文件夹中,或在你的用户主文件夹中)中进行设置以使 cargo 可以与它工作:

[target.wasm32-unknown-unknown]
runner = "wasm-server-runner"

现在你可以直接如下运行你的游戏:

cargo run --target wasm32-unknown-unknown

它将自动运行一个最小的本地 Web 服务器并在浏览器中打开你的游戏。

wasm-bindgen

wasm-bindgen 是一个工具,用于生成将游戏放在你的网站上所需的所有文件:

像如下运行:

cargo build --release --target wasm32-unknown-unknown
wasm-bindgen --out-dir ./out/ --target web ./target/

./out/ 目录是它用来放置输出文件的地方。

你需要把这些放在你的 Web 服务器上。

./out/ is the directory where it will place the output files.

You need to put these on your web server.

更高级的工具

这里有一些更高级的候选工具。这些工具可以为你做更多的事情,使你的工作流程更加自动化,但在工作方式上也更有个人主张。