如何修改 godot 3 导出的 html 页面的 index.wasm 地址

上一次我们讲了如何把 godot 2 的 index.asm.js 移动到其他位置，来提升加载的速度，文中我们提到 godot 3 提供的 web 引擎会有一个跨域访问的问题，现在我们来看一下这个问题怎么解决

1 问题

我们观察一下 godot 3 引擎导出的目录：

我们可以推测 index.wasm 是编译好的 godot 引擎，但是观察了下 index.html，其中并没有显式引用 index.wasm，不过一点简单的调试告诉我们，引擎初始化时会去加载 index.wasm，所以，如果我们把 index.wasm 放到另一个域，就会有一个跨站访问的问题（cross-origin resource sharing）

2 解决

解决这个问题，其实就是要去除 引用位置 对脚本使用范围的限制，我们以 nginx 为例，假设我们使用一台网速较快的 nginx 服务器（以下简称为 cdn nginx）来提供 index.wasm，那么需要怎样的改动呢

2.1 index.html 文件的修改

index.html 中并没有显式地初始化引擎，是因为执行 engine.startGame 前，如果引擎没有被初始化，则会按默认路径自行初始化，毫无疑问这个路径是和游戏路径相同的，所以我们要在引擎创建后自行初始化，我们在 startGame 之前来自行初始化引擎

engine.init("https://tricks.one/index"); // 这行是我们添加的
engine.startGame(MAIN_PACK).then(() => {
	setStatusMode('hidden');
	initializing = false;
}, displayFailureNotice);

2.2 运行本地 http 服务器，使用浏览器开发者模式访问

我们可以使用工具来把 godot html 的导出目录作为一个本地 http 服务器来访问，工具有很多，这里不会详细描述，本文是使用 python 的 SimpleHTTPServer

python -m SimpleHTTPServer 8000

使用开启开发者模式的 chrome 访问 localhost:8000 会得到如下提示

两个错误，一个是找不到 index.wasm，一个是违反了 cors 规则，不过这是个好消息，我们对本地游戏网页服务器的改造已经完成了，找不到 index.wasm 是因为我们还没有上传到服务器，cors 则是后续我们要解决的问题

2.3 复制 index.wasm 到 cdn nginx 的网页目录

这个对有 nginx 使用经验的人来说应该不算难事，不再详细叙述，简单使用 scp 复制到网页目录就可以

然后我们再次访问 localhost:8000

404 的问题解决了！接下来就是 cors 的问题

2.4 nginx 配置修改

打开 nginx 的配置文件，为 index.wasm 加入以下配置

location /index.wasm {
    add_header Access-Control-Allow-Origin *;
}

重启 nginx，再使用浏览器访问本地游戏服，就可以发现，index.wasm 可以正确从另一个位置加载了

3 总结

根据上述方法我们可以得出结论，将 godot 引擎部署到另一个位置是可行的，但是前提是可以配置跨域请求，有个这个办法，我们就可以重复利用现有已部署的 godot 引擎，而不必每发布一次游戏，都需要把 godot 引擎都打包进去。