> For the complete documentation index, see [llms.txt](https://docs.edgegap.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.edgegap.com/ru/docs/sample-projects/unity-netcodes/fishnet-on-edgegap-webgl.md).
# Fishnet WebGL
Это руководство поможет вам использовать [FishNet](https://github.com/FirstGearGames/FishNet)транспорт Websocket, [Bayou](https://fish-networking.gitbook.io/docs/manual/components/transports/bayou), и создать безголовый сервер на Edgegap для проекта Unity.
Вы можете найти окончательный пример проекта на нашем [GitHub](https://github.com/edgegap/netcode-sample-unity-fishnet), в разделе `Fishnet_v4.1.6R_WebGL` папки. Это руководство должно работать с любой версией Fishnet, при условии, что вы используете соответствующую версию Bayou для неё.
{% hint style="info" %}
Поскольку FishNet версии 4.1.6R поставляется с включённым плагином Edgegap, мы будем использовать его для автоматической сборки и контейнеризации нашего игрового сервера, хотя это можно сделать и вручную с помощью Dockerfile.
Для получения дополнительной информации о плагине вы можете прочитать нашу документацию [здесь](broken://pages/8f2a97be56c6cb22e241d0ea675b0c2aafba8497).
Вам необходимо, чтобы Docker был запущен, чтобы всё работало корректно.
{% endhint %}
### Требования Unity
Этот проект протестирован на версии Unity `2021.3.16f1`. С ней необходимо установить следующие модули:
* Поддержка сборки WebGL;
* Поддержка сборки выделенного сервера Linux;
* Поддержка сборки Linux (IL2CPP).
### Переключить транспорт
Скачайте пакет Unity для Bayou на [этом GitHub](https://github.com/FirstGearGames/Bayou/releases). Импортируйте пакет в игровой проект через панель инструментов в `Asset/Import Package/Custom Package...`.
Откройте `MainMenu` сцену, расположенную в `Assets/SpaceEdge/Scenes`вашей игры. `NetworkManager` gameObject, удалите компонент транспорта `Tugboat` . Замените его на `Bayou` транспорт, находящийся в `Asstes/FishNet/Plugins/Bayou`. Обратите внимание на установленное значение порта, в данном случае `7770`.
Убедитесь, что включена опция `Start On Headless` для сборки сервера.
### Сборка игрового сервера и контейнеризация
Откройте плагин Edgegap через меню панели инструментов `Edgegap/Edgegap Hosting` . Проверьте ваш `Edgegap API Token` и либо создайте, либо загрузите приложение для игры. Убедитесь, что `port` значение совпадает со значением транспорта Bayou. Выберите `WS` protocol, затем введите `New Version Tag`.
Когда всё будет правильно настроено, нажмите `Build and Push`, что автоматически контейнеризирует ваш игровой сервер и создаст новую версию приложения на панели Edgegap после короткого ожидания.
### Тестирование клиента
#### В редакторе
Вернувшись в проект, выберите `MatchmakingSystem` gameObject и измените следующие поля:
* AppName: Установите значение «Application name», которое вы использовали с плагином Edgegap.
* AppVersion: Установите значение «Version name», которое вы использовали с плагином Edgegap.
* AuthHeaderValue: Установите значение токена Edgegap API, который вы использовали с плагином Edgegap.
{% hint style="info" %}
Удалите `токен` слово из токена API, потому что мы задаём это как схему заголовка аутентификации во время `Awake()` метода скрипта `MatchmakingSystem`.
{% endhint %}
Откройте `MatchmakingSystem` , расположенного в `Assets/SpaceEdge/Scripts/Systems`, где вы также можете обновить те же значения. Найдите `"UDP_PORT"` и замените на `"Game Port"`.
{% hint style="info" %}
В предыдущих версиях этого примера приложение создавалось вручную через панель управления Edgegap, и имя `UDP_PORT` использовалось для порта, используемого сервером.
Плагин Edgegap автоматически называет порт `Game Port` вместо этого, поэтому мы должны убедиться, что скрипт обновлён. Иначе игра не будет работать.
{% endhint %}
Убедитесь, что вы также снимете галочку с `Start On Headless` в `NetworkManager` gameObject.
После этого нажмите `Play` в редакторе, затем введите имя в текстовое поле и нажмите `Start Game`. Игра проверит наличие доступного сервера или автоматически развернёт его, если ни одного нет, прежде чем подключиться к нему.
{% hint style="warning" %}
Если на стороне клиента возникает `ConnectionFailed` ошибка, это может быть потому, что опция `Start On Headless` не была включена в `серверной сборке`, что означает, что развёртывание не готово принимать подключения, поскольку сервер никогда корректно не запустился. Убедитесь, что опция включена, прежде чем пытаться снова, создав новый образ контейнера и версию приложения.
Это также может быть связано с тем, что `имя порта` версии приложения не совпадает с именем в `MatchmakingSystem` скрипте. Убедитесь, что оба имеют одинаковое имя, в данном случае `"Game Port"`, прежде чем пытаться снова.
{% endhint %}
#### На Itch.io
После того как вы убедились, что игровой клиент работает в редакторе, он должен работать и на Itch.io. Чтобы загрузить игру туда, вам нужно сделать клиентскую сборку в `Экран сборки` в Unity Editor, в меню `Файл -> Параметры сборки`. Выберите следующие параметры:
* Установите `Платформа` к `WebGL`;
* Откройте `Player Settings`. В разделе `Player -> Publishing Settings`установите `Compression Format` к `Gzip` и убедитесь, что опция `Decompression Fallback` выбрана. Сохраните эти настройки и закройте окно.
Затем нажмите собрать и выберите новую пустую папку с именем `build` в качестве конечной папки. Сожмите файлы этой `build` папки в zip-архив, убедившись, что они находятся в корне архива. Затем просто загрузите zip-архив в свой проект Itch и не забудьте выбрать опцию для запуска файла в браузере. Игра должна работать так же, как в редакторе.