企业官网建设流程全解析

Godot Web 导出实战：HTML5 游戏快速发布

【免费下载链接】godot-docsGodot Engine official documentation项目地址: https://gitcode.com/GitHub_Trending/go/godot-docs

游戏做完了，你希望玩家不用下载、点开链接就能直接玩。用 Godot Web 导出，可以把项目编译成 WebAssembly 模块，在任何支持 WebGL 2.0 的现代浏览器里跑起来。整个链路其实就四件事：装模板、建预设、点导出、丢到任意静态服务器上。

先把网页版跑起来

最快建立信心的方式，就是让游戏先在浏览器里转一圈。一共五步：

1. 装导出模板：编辑器菜单 →Manage Export Templates，下载当前 Godot 版本对应的 Web 模板。
2. 建预设：项目 →Export→Add…，平台选Web。Thread Support保持单线程（4.3 起的默认项，兼容性最好）。
3. 导出项目：在导出对话框点Export Project…，主文件命名成index.html，这样浏览器访问目录时默认就能加载它。
4. 本地跑通：用任意静态服务器打开导出目录，比如执行python3 -m http.server再访问 localhost。预设勾选了 Runnable 的话，编辑器顶部还有一键启动按钮，直接在默认浏览器里打开。
5. 验证结果：白屏的话按F12打开开发者控制台，看 JavaScript 和引擎的错误信息。

注意一点：Godot 4 的 Web 导出只支持Compatibility渲染方法，项目如果用的是 Forward+ 或 Mobile，要先切过去，否则导出后跑不起来。

单线程还是多线程？

这个选择直接决定你后面要配多少服务器，所以导出前就定下来。

单线程对服务器零特殊要求，在各发布平台上的兼容性最好，也是官方推荐的默认方案。多线程性能更高、音频延迟更低，但它依赖SharedArrayBuffer，必须用 HTTPS 提供，外加两个跨源隔离响应头，页面里也不能出现任何第三方资源（比如广告脚本）。响应头缺失且没开 PWA 兜底的话，项目会直接拒绝运行。

Web 特有的三个坑

从桌面版搬来的项目最容易在这三处翻车，逐个看「现象 → 原因 → 解法」。

音频一上来是静音的

现象：页面刚打开时音乐和音效都不出声，点一下页面才开始播放。原因：浏览器统一限制自动播放，音频上下文要等用户产生一次真实交互才能解锁。解法：开始画面放一个「点击开始」，交互后再播第一声；另外 4.3 起 Web 端默认用Sample播放模式，延迟低但不支持混响这类音频特效，需要特效的话把AudioStreamPlayer节点的Playback Type改成Stream，或在项目设置Audio > General > Default Playback Type.web里全局改，代价是延迟变高。

全屏和鼠标捕获「不生效」

现象：在_ready里调全屏或捕获鼠标，没有任何反应。原因：浏览器只允许在「处理一次输入事件」的响应里进入全屏、捕获光标，平时调用一律拒绝。解法：把调用挪进_input或_unhandled_input的事件回调，且此时对应的输入事件必须正在被处理：

func _input(event): if event.is_action_pressed("ui_fullscreen"): get_window().mode = WINDOW_MODE_FULLSCREEN elif event.is_action_pressed("ui_cancel") and Input.mouse_mode == Input.MOUSE_MODE_CAPTURED: Input.mouse_mode = Input.MOUSE_MODE_VISIBLE

user:// 里的存档隔天就没了

现象：写进user://的存档关掉页面还在，隔天打开浏览器却说找不到。原因：Web 上的用户目录实际落在浏览器 IndexedDB 里，前提是用户允许了 Cookie；无痕模式必然不持久，游戏嵌在 iframe 里时还得额外开第三方 Cookie。解法：运行时可以用OS.is_userfs_persistent()判断（文档说明它偶有假阳性，只作参考）；关键进度别只依赖本地存储，重要数据放到服务端。

让页面加载更快

加载速度直接决定玩家的第一印象，值得先定目标再动手。

导出产物里最重的两个文件是.wasm和.pck。开启服务端 gzip 后，wasm 通常能压到原始体积的四分之一左右；服务器支持的话优先上 Brotli 预压缩，并给这两个二进制文件配长期缓存，它们内容稳定，浏览器不会反复请求。如果你部署在 itch.io 这类不做实时压缩的平台，要自己先压缩好文件再上传。

服务器端配置

选了多线程的话，服务器配置就绕不开了，核心要求就三样：两个 CORS 响应头、正确的 MIME 类型、压缩。

单线程导出不需要那两个响应头，但 HTTPS 和压缩建议照样配上。一份典型的 Nginx 配置：

server { listen 443 ssl; server_name your-game.example.com; # 多线程导出必需的响应头（SharedArrayBuffer 要求） add_header Cross-Origin-Opener-Policy "same-origin" always; add_header Cross-Origin-Embedder-Policy "require-corp" always; location / { root /var/www/game; index index.html; } gzip on; gzip_types application/wasm application/javascript text/css; }

如果你控制不了响应头（比如平台不让改服务器配置），在导出选项里勾Progressive Web App > Enable，内置的 service worker 会模拟出这两个响应头来兜底，但页面本身仍要求 HTTPS。

进阶：PWA 与 JS 互操作

基础跑通之后，还有两个能力可以顺手用上。

第一个是 PWA。在导出选项勾选Progressive Web App > Enable后，项目会带上高分辨率图标、显示模式和屏幕方向，用户可以把它加到设备主屏幕；service worker 还会缓存整个项目，首次在线加载后就能离线游玩，缓存被浏览器清掉时还可以配一张Offline Page兜底。

第二个是 JS 互操作。JavaScriptBridge单例让 GDScript 能直接拿到浏览器对象并调用它，比如打印一条日志：

var console = JavaScriptBridge.get_interface("console") console.log("Hello, Web!")

加载第三方 SDK、监听页面卸载事件这类场景都是同一个套路，写法细节可以翻仓库里的tutorials/platform/web/javascript_bridge.rst。

上线前自查

把链接发给玩家之前，把这份清单过一遍，每一条都是真实踩过的坑：

• 开始画面要求点击 / 触摸 / 按键后才播放第一段音频
• 多线程导出：两个 CORS 响应头已生效，且站点是 HTTPS 🌐
• .wasm和.pck已压缩（平台不支持实时压缩时做了预压缩）
• Chrome、Firefox、手机 Safari 各实测一次
• 正常网络下首载时间在 3 秒内
• 存档在关页重开后可读（确认用户 Cookie / IndexedDB 权限，无痕模式除外）
• 切走标签页时游戏会被浏览器挂起，联网游戏已处理断线重连

清单全部打勾，导出产物就可以交给服务器了。完整的 Web 导出选项、音频配置和故障排查，在tutorials/export/exporting_for_web.rst里都有，上线前值得再翻一遍。

【免费下载链接】godot-docsGodot Engine official documentation项目地址: https://gitcode.com/GitHub_Trending/go/godot-docs