Занимаюсь разработкой игр на Godot и исследованием малоизвестных движков, фреймворков и языков программирования.Nefracehttps://teletype.in/atom/nefrace2026-07-26T13:13:26.556Znefrace:godot-and-html52023-07-07T13:04:53.796Z2023-07-11T09:05:57.239Z

<img src="https://img1.teletype.in/files/86/d6/86d6ced9-1113-4f99-97e3-c6fa4da9bde6.png">Браузерные игры давно укрепились в сознании людей как способ быстренько скоротать несколько минут времени, не парясь установкой чего либо на своё устройство. И со временем появляется всё больше способов их создавать. Чистый JavaScript, фреймворки, и даже экспорт из Unity. Godot Engine также предоставляет средства для создания браузерных игр.

<p id="iUPh">Браузерные игры давно укрепились в сознании людей как способ быстренько скоротать несколько минут времени, не парясь установкой чего либо на своё устройство. И со временем появляется всё больше способов их создавать. Чистый JavaScript, фреймворки, и даже экспорт из Unity. Godot Engine также предоставляет средства для создания браузерных игр. </p> <p id="NxzK">Однако, с приходом версии 4.0 появилась целая волна сообщений от разных авторов о том, что их игры на Годо абсолютно не работают в вебе, а только показывают небольшое окно с непонятной ошибкой, говорящей об отсутствии каких-то <strong>Cross Origin Isolation </strong>и<strong> SharedArrayBuffer</strong>…</p> <figure id="zUes" class="m_original" data-caption-align="center"> <img src="https://img1.teletype.in/files/86/d6/86d6ced9-1113-4f99-97e3-c6fa4da9bde6.png" width="640" /> <figcaption>Страшный сон разработчика на Godot 4.0</figcaption> </figure> <h2 id="YBD3">Что такое SharedArrayBuffer и зачем он нужен?</h2> <p id="LJpI">Если очень сильно упрощать — SharedArrayBuffer позволяет нескольким потокам приложения эффективно обмениваться информацией из одного источника. В Godot 3 нельзя создавать новые потоки, а также есть проблемы со звуком, проявляющиеся в виде задержек или подвисаний. Большинство современных браузеров поддерживают эту технологию, однако требуют включения межсайтовой изоляции (Ещё один термин, встречающийся в ошибке - <strong>Cross Origin Isolation</strong>), чтобы предотвратить доступ к данным из общей памяти другими страницами. В общем случае делается это при помощи отдачи сервером, который показывает страницу, двух заголовков:</p> <pre id="zfg5">Cross-Origin-Opener-Policy: same-origin Cross-Origin-Embedder-Policy: require-corp</pre> <p id="wSvI">По этому поводу есть отличная статья на <a href="https://web.dev/i18n/ru/cross-origin-isolation-guide/" target="_blank">web.dev</a></p> <h2 id="gSJN">Решение проблемы</h2> <p id="sZdz">А что с этим делать нам? Ну, есть несколько вариантов, зависящих от того, куда вы выкладываете игру:</p> <ul id="tRmS"> <li id="NyAM">Если вы делаете игру для площадки Itch.io, то поздравляю! Вам достаточно на странице игры включить пункт &quot;SharedArrayBuffer support&quot;, который сразу же заставит игру работать.</li> </ul> <figure id="3lNC" class="m_original" data-caption-align="center"> <img src="https://img2.teletype.in/files/5f/60/5f60f6a9-b949-4a39-bf02-495963f8c07f.png" width="608" /> <figcaption>Почти в самом низу страницы с настройками проекта.</figcaption> </figure> <ul id="Xy5D"> <li id="OttU">Если же игра, внезапно, находится на вашем собственном веб-сайте значит скорее всего у вас есть доступ к настройкам веб-сервера и вы сможете указать нужные заголовки самостоятельно. Тут я не буду на этом останавливаться подробно, потому что конфиги явно будут менятся от сервера к серверу, будь то Apache, Nginx, Caddy или всё происходит через панель управления вашего хостинга.</li> <li id="O3NZ">Если вы не имеете доступа к серверной части и не можете менять отправляемые им заголовки, то недавно появился обходной путь в виде небольшого проекта под названием <a href="https://github.com/gzuidhof/coi-serviceworker" target="_blank">coi-serviceworker</a>, который один добрый человек под ником Nisovin обернул в <a href="https://godotengine.org/asset-library/asset/1818" target="_blank">ассет</a>. Достаточно установить этот плагин в проект и включить в настройках!</li> </ul> <figure id="3bk0" class="m_original" data-caption-align="center"> <img src="https://img4.teletype.in/files/3f/20/3f209b4e-4592-4a30-9650-500600867f9d.png" width="386" /> <figcaption>Так ассет выглядит в каталоге</figcaption> </figure> <figure id="u4gt" class="m_original" data-caption-align="center"> <img src="https://img3.teletype.in/files/25/f1/25f10e3c-f1d3-4989-96f6-dbe95057d230.png" width="678" /> <figcaption>Здесь он включается</figcaption> </figure> <p id="Lk9b">После этого ничего больше не нужно настраивать, игра запустится без каких либо проблем, но с одной оговоркой: страница с игрой должна один раз перезагрузиться после первоначальной подгрузки скрипта, благо, это дело автоматизировано. Однако, если вы хотите такую игру где-то опубликовать, например, на тех же Яндекс Играх, то скорее всего, она не пройдёт модерацию как раз по причине перезагрузки. Я лично это не тестировал, но шансы не нулевые.</p> <h2 id="y2z2">Что можно сделать ещё?</h2> <p id="TEvE">Какой же самый идеальный вариант? На данный момент, если вы заранее знаете, что хотите выпускать игру для браузеров и хотите охватить максимум устройств, используйте Godot 3 версии. Это всё ещё отличный движок, который будет продолжать поддерживаться ещё долгое время, так как обрёл статус LTS-релиза, и игры на нём будут работать на большинстве устройств, хоть и не без проблем в виде подлагивающего звука на слабых телефонах.</p> <p id="QBzJ">В пользу выбора третьей версии говорит ещё то, игры на Godot 4 могут не работать на устройствах фирмы Apple из-за того, что в их браузерах на данный момент не поддерживается WebGL 2, который, опять же, является требованием для веб-экспорта из Godot 4. Так что если вы планируете не оставить владельцев данных устройств без своей игры, или сами являетесь гордым пользователем Apple - смело берите Godot 3.5.2 и в дальнейшем 3.6.</p> <p id="8S00">Если же вы только начинаете осваивать Godot и знаете наверняка, что хотите делать браузерные игры, советую всё же обратить внимание на специализированные движки вроде Defold, Phaser.JS и другие. Они буквально заточены под работу с HTML5, а значит являются отличным выбором конкретно для этой цели. Всё-таки, нет того движка, который был бы идеален во всём, верно?</p>