Как заставить Rust Game of Life WebAssembly работать как статический веб-сайт?

Question

Я прошел через руководство по Rust Game of Life и у меня есть рабочая игра в веб-браузере, но она работает только с демонстрационного веб-сервера, который идет в комплекте с ней. Я могу запустить сервер сnpm startи он запускает webpack-dev-server на порту 8080. Когда я захожу на сайт через этот порт, он работает нормально. Однако, если я попытаюсь скопировать сайт на веб-сервер, например Apache, он загрузится неправильно. Ошибка, которую я сейчас получаю:

Error importing `index.js`: TypeError: Error resolving module specifier “wasm-game-of-life”. Relative module specifiers must start with “./”, “../” or “/”. bootstrap.js:5:23
<anonymous> http://www.north-winds.org/gol/bootstrap.js:5

Из учебника корень веб-сайта - это папка с именем www/ в репозитории, а сгенерированный модуль wasm из программы Rust помещается в pkg/. Есть символическая ссылка отwww/node_modules/wasm-game-of-life это указывает на ../../pkg/ и я заменил эту символическую ссылку фактической копией верхнего уровня pkg/ папка, чтобы веб-сайт полностью находился внутри www/папку, а затем разместил эту папку на моем веб-сайте по адресу http://www.north-winds.org/gol/, однако доступ к ней возвращает ошибку, указанную выше. Что мне нужно изменить, чтобы он работал автономно?

Насколько я понимаю, эта WebAssembly Game-of-Life в основном является автономным клиентским приложением и не требует чего-либо, кроме веб-сервера, который может предоставлять статические файлы с соответствующими подключенными mime-типами. Я не вижу ничего особенного, что должно требоваться. Я где-то видел упоминание о WebSockets, но не знаю, почему это требуется для этого приложения. Я сравнил это с примером WebAssembly "Hello, World" для языка C с https://webassembly.org/ и получил.wasmфайл, созданный из исходного кода C, и один вспомогательный файл JavaScript и HTML для его выполнения. Файлы работали правильно при простом копировании в статическое расположение веб-сервера. Это то, что я хотел бы для примера на Rust.

Некоторый соответствующий код из Rust Game-of-Life выглядит следующим образом. HTML-файл верхнего уровня включает это среди других строк:

<script src="./bootstrap.js"></script>

Файл начальной загрузки JavaScript содержит только следующее:

import("./index.js")
  .catch(e => console.error("Error importing `index.js`:", e));

И файл index.js, на который он ссылается, помимо прочего склеивает логику для Wasm:

import { Universe, Cell } from "wasm-game-of-life";                             
                                                                            
// Import the WebAssembly memory at the top of the file.                        
import { memory } from "wasm-game-of-life/wasm_game_of_life_bg";                

Что не хватает, чтобы сделать эту работу автономной?

Answer 1

В www а также pkgпапки содержат нужные вам исходные файлы, но у вас еще нет статического сайта. В create-wasm-app шаблон использует Webpack, поэтому вам нужно создать окончательный результат, запустив npm run build в wwwпапка. Это создаст подпапку с именемdist который содержит фактические статические файлы, которые можно разместить на вашем веб-сервере.