{ "version": "https:\/\/jsonfeed.org\/version\/1", "title": "#mopsicus: заметки с тегом js", "_rss_description": "об играх, разработке на Unity и личном опыте", "_rss_language": "ru", "_itunes_email": "", "_itunes_categories_xml": "", "_itunes_image": "", "_itunes_explicit": "", "home_page_url": "https:\/\/mopsicus.ru\/tags\/js\/", "feed_url": "https:\/\/mopsicus.ru\/tags\/js\/json\/", "icon": "https:\/\/mopsicus.ru\/user\/userpic@2x.jpg?1707898340", "author": { "name": "Игорь Лопатин", "url": "https:\/\/mopsicus.ru\/", "avatar": "https:\/\/mopsicus.ru\/user\/userpic@2x.jpg?1707898340" }, "items": [ { "id": "269", "url": "https:\/\/mopsicus.ru\/all\/loto-cards-generator-chatgpt\/", "title": "Лото и ChatGPT 😅", "content_html": "
\n

Russian Loto cards generator<\/h3>

Russian Loto cards generator<\/h4>\"Russian\n<\/div>\n

Как-то мы захотели поиграть в Русского Лото, классическое, оффлайновое, там где мешок, бочонки, карточки. Но людей много, а карточек мало, к тому же они от игры к игре повторяются. Хотелось полного рандома. Думал зайду в Google, скачаю генератор и распечатаю сколько мне нужно новых карточек. Но оказалось, что такой штуки просто нет 🤷‍♂️ Ну или я плохо искал.<\/p>\n

В общем, самому писать такое было неинтересно, да и некогда, поэтому решил проверить победили ли нас машины или нет, надо уже менять профессию или нет — попробовал написать всё с помощью ChatGPT. В итоге получилось всё как я хотел, но надо сказать, что это было не как в фильме Железный человек, когда Джарвис всё понимал с полуслова. В какой-то момент хотелось уже руками поправить код и забыть, но интересно было именно таким способом сделать от начала до конца.<\/p>\n

Получился генератор карточек для игры в Русское Лото<\/a>, в виде одной HTML странички, весь HTML и код на JavaScript сгенерил ChatGPT, я ни строчки не написал :) Можно указать количество страниц для генерации, и на каждой будет 4 карточки с рандомными числами в соответсвии с правилами игры. Файл сохраняется в PDF.<\/p>\n", "date_published": "2024-12-03T12:00:07+03:00", "date_modified": "2024-12-03T12:00:03+03:00", "image": "https:\/\/mopsicus.ru\/pictures\/loto-generator.png", "_date_published_rfc2822": "Tue, 03 Dec 2024 12:00:07 +0300", "_rss_guid_is_permalink": "false", "_rss_guid": "269", "_e2_data": { "is_favourite": false, "links_required": [], "og_images": [ "https:\/\/mopsicus.ru\/pictures\/loto-generator.png" ] } }, { "id": "257", "url": "https:\/\/mopsicus.ru\/all\/unity-webgl-tips\/", "title": "Unity и WebGL", "content_html": "

\n

Unity WebGL tips<\/h3>

Unity WebGL tips<\/h4>\"Unity\n<\/div>\n

Не от хорошей жизни пришлось делать WebGL версии наших мобильных игр :) Т. е. изначально, игры не продумывалась для браузера, но тем не менее, после небольших доработок и рефакторинга — всё необходимое заработало. Эта статья как раз для тех, кто задумался над выпуском версии для веб: набор из нескольких наблюдений, советов, собственных мыслей и велосипедов.<\/p>\n

Вебсокеты<\/b>. Так как у нас все игры — онлайн, то первое что сделал — поддержка сети. В мобильных играх у нас используются TCP сокеты, для браузера же надо использовать вебсокеты (WebSocket). И сразу надо сказать: C#’ские вебсокеты работать не будут. Надо брать готовый или писать свой JS плагин. И в качестве примера, в телеграм канале я уже постил этот реп<\/a>. Он старый, работает и для примера пойдёт. Там кстати сделана поддержка вебсокетов в редакторе (уже через C#’ские). Т. е. можно дебажить и билдить, работать всё будет. В ассетсторе тоже есть разные реализации вебсокетов для WebGL, можно поискать, есть и Socket.IO, Mirror.<\/p>\n

Да, для WebGL тоже можно и нужно писать плагины<\/a>, как и для Android и iOS.<\/p>\n

В общем, в браузере много что работать не будет и особенно всё что связано с мобильной платформой: галерея, авторизация, пуши, буфер обмена, платежи — это всё надо делать или через JS плагины, менять реализацию или вообще отказываться.<\/p>\n

Платежи<\/b>. Google Play и AppStore не работают в WebGL. В том смысле что нельзя получить информацию о продукте (описание, цена и т. д.) и сделать покупку в браузере. Поэтому мы сделали просто: вместо запроса списка продуктов, делаем запрос к нашему серверу (сервер определяет что клиент WebGL) и в ответ получаем примерно такую же структуру: цена: описание, количество. Но самое главное — приходит ещё и ссылка для оплаты! Т. е. для пользователя визуально всё осталось также, но при попытке оплаты открывается новая вкладка с сформированной ссылкой на оплату нужного товара. А тут уже можно подключить любой удобный сервис приема платежей и по коллбеку успешной оплаты начислять пользователю определенное количество продукта. Вот такие антисанкции.<\/p>\n

Загрузка изображений<\/b>. Тут проще, в браузерах уже есть встроенный механизм загрузки файлов, его и можно использовать. Вот пример как это реализовано<\/a>, а на SO можно прочитать<\/a> как автор до этого дошёл. К слову, этот код рабочий. Немного корявенький, требует рефакторинга, но работает. Картинка приходит в Unity в base64, раскукоживаете её в массив байт и дальше уже что требуется: отправляете на сервер, используйте в игре и т. п.<\/p>\n

Уведомления<\/b>. Все ненавидят уведомления в браузере. И у нас их скорее всего не будет. Но раз обещал, напишу что сохранил для себя если вдруг надумаем (или вы надумаете) делать пуши: плагин можно собрать из таких запчастей<\/a>, честно не пробовал ещё, скорее всего буду свой писать :) Это Firebase Cloud Messaging<\/a>, он бесплатный и вообще можно отсылать пуши на все платформы. Для реализации на своем сервере, например для NodeJS, можно погуглить web-push<\/a>. На Хабре есть статьи, вот свежая относительно про PHP и web пуши<\/a>. Есть еще pushjs.org<\/a>, оно вроде как работает во всех браузерах, можно устанавливать кастомный сервис-воркер. Как писать воркеры можно почитать в таком cook-book’e<\/a>. Но опять же, всё что связано с пушами не проверял ещё.<\/p>\n

Google и Apple авторизация<\/b>. У нас в приложениях как раз используются такие способы авторизации. И для них есть возможность сделать веб авторизацию, чего не скажешь про Huawei ID, хотя может и китайцы скоро допилят. Так вот, тут тоже всё относительно просто: открываете мануал как сделать веб авторизацию на своем сервере и делаете: Google<\/a> и Apple<\/a>. Про Apple есть еще норм статья на Хабре от ЦИАН<\/a>. Основной момент тут — это редирект после успешной авторизации, туда можно подставить свои параметры, а внутри плагина перехватить их и использовать для авторизации уже в WebGL приложении. Вот нашел грубый пример<\/a> как это может работать. Автор как и предупреждает не совсем верно использует запрос авторизации. Лучше открывать свою страницу с кнопкой(-ми) авторизации и уже после успешного завершения перехватывать редирект со своего сайта.<\/p>\n

Где размещаться?<\/b> В комментариях в телеге спросили на каких сервисах публикуем WebGL игры — точно будем пока на своих сайтах, для нас это больше инструмент для платежей. Но в перспективе, рассматриваем ВК и Одноклассники. Может и во вражеском ФБ, кто знает. На реддите нашёл вот небольшой список<\/a> где можно разместиться, старый, но наверняка что-то живое есть, https:\/\/itch.io<\/a> точно.<\/p>\n

И бонус, как сделать рабочий вариант копирования в буфер обмена<\/a> во всех (вроде как) браузерах.<\/p>\n

Ну и ещё бонус, точнее анонс: мы делаем онлайн мобильную 3D игру, до этого как-то больше по 2D всё было, так что будут интересности по 3D. Подписывайтесь на Telegram канал<\/a>.<\/p>\n", "date_published": "2022-04-23T17:50:39+03:00", "date_modified": "2022-04-23T17:50:14+03:00", "image": "https:\/\/mopsicus.ru\/pictures\/unity-webgl-tips.png", "_date_published_rfc2822": "Sat, 23 Apr 2022 17:50:39 +0300", "_rss_guid_is_permalink": "false", "_rss_guid": "257", "_e2_data": { "is_favourite": false, "links_required": [], "og_images": [ "https:\/\/mopsicus.ru\/pictures\/unity-webgl-tips.png" ] } }, { "id": "164", "url": "https:\/\/mopsicus.ru\/all\/node-js-game-server-unity-client\/", "title": "Сервер на Node.js и клиент на Unity", "content_html": "

\n

<\/h3>

<\/h4>\"\"\n<\/div>\n

Задумал я тут выложить на Github свою очередную поделку — простой сервер на Node.js и клиента к нему на Unity. Много раз сам гуглил различные библиотеки, пробовал, тестировал, пытался сам написать что-то (с моими познаниями в Node.js :), но потом подсмотрел как сделано у старого китайского Pomelo<\/a>, который уже сто лет не поддерживается.<\/p>\n

Если честно, когда я первый раз узнал про Pomelo и начал его изучать, то понял, что для моих текущих задач такой функциональности не требуется, поэтому решил выпилить всё что не нужно. В итоге, осталось вот что:<\/p>\n

Опыта в Node.js у меня не очень много, поэтому я нагуглил такой фреймворк — Architect. Не знаю насколько это оправдано, но пока сделано с помощью него.<\/p>\n