Форум программистов, компьютерный форум, киберфорум
Node.js
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск  
 
 
Рейтинг 4.76/34: Рейтинг темы: голосов - 34, средняя оценка - 4.76
0 / 0 / 0
Регистрация: 13.01.2017
Сообщений: 17

Прошу совета - клиент-серверная онлайн-игра через web с браузерным клиентом на JavaScript

13.01.2017, 16:04. Показов 7470. Ответов 48
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Добрый день
Суть моего обращения, такова:
Разрабатываю компьютерную игру (пошаговую, передаваемые данные незначительны по объёму). Клиент, пишу на JavaScript HTML5 Canvas - с этим проблем не возникло, уже написал здоровый кусок этого клиента
Теперь, надо продумать серверную архитектуру - на каком языке писать сервер игры, как задружить его с клиентами
Стал рыть инет - сколько ни рыл, пока одни непонятки
Суть в том, что (как понимаю) JavaScript не дружит с TCP-сокетами
Дружит с веб-сокетами, но чтобы их реализовать на сервере, требуется какая-то просто диссертация как почитаешь
Может быть, AJAX? Но как именно?
Про node.js, читал. Тоже непонятки, как что, вроде не рекомендуют юзать
Прошу добрых людей, направить меня носом моим в нужное русло. Чтобы избрать нормальную архитектуру сразу, и по сто раз не переделывать.
Заранее спасибо за помощь.
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
13.01.2017, 16:04
Ответы с готовыми решениями:

Клиент-серверная игра
Здравствуйте, мне нужно реализовать клиент-серверную игру в крестики-нолики, где клиентом и сервером управляют 2 пользователя. Я пока не...

Архитектура приложения клиент, прошу совета
Ситуация - есть некий программный сервер с БД и текущими состояниями массива объектов. Приложение цепляется к нему по WCF. Приложение...

Клиент-серверная игра. Подключение нескольких игроков
Всем привет) Возник такой вопрос: У меня игра рулетка, клиент-серверная. Пока работает только так: для каждого подключенного игрока...

48
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
19.01.2017, 14:21
Студворк — интернет-сервис помощи студентам
Цитата Сообщение от vic5710 Посмотреть сообщение
дезинформация однако
Извините, ошибся! npm install socket.io

Добавлено через 2 часа 40 минут
Раз от TC негатива больше нет, то покажу пример, он точно будет работать, так как я проверил. Может ещё кому пригодится. На всякий случай сохранил этот пример в запись блога.

Создайте папку для проекта. Находясь в папке проекта, нужно набрать команды:
npm init -y
npm install express --save
npm install socket.io --save
npm install shortid --save (ставить shortid необязательно, но для примера нужно)
Создайте папку 'public', где будут хратиться файлы клиента: .html, .js, .css

В папке проекта создайте файл app.js (для серверной части). А в папке 'public' создайте один файл index.html

Логика примера. После запуска серверного скрипта (node app.js) сервер создаёт ID и отсылает его клиенту. Клиент выводит ID. Если на клиенте нажать кнопку "Send data to the server", то сервер выведет принятые от клиента данные.

public/index.html
Кликните здесь для просмотра всего текста
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
</head>
<body>
    <button onclick="sendMessage()">Send Massage to server</button>
    <script>
        var socket = io();
 
        socket.on("hello", function (data)
        {
            console.log("Hello, your id is " + data.id);
        });
 
        function sendMessage()
        {
            socket.emit("button_click", { mess: "hello from client" });
        }
    </script>
</body>
</html>


app.js
Кликните здесь для просмотра всего текста
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
var express = require("express");
var app = express();
var http = require("http").Server(app);
var io = require("socket.io")(http);
var shortid = require("shortid");
 
app.use(express.static(__dirname + "/public"));
 
io.on("connection", function (socket)
{
    var thisPlayerId = shortid.generate();
 
    console.log("client connected, id: ", thisPlayerId);
 
    socket.emit("hello", { id: thisPlayerId });
 
    socket.on("button_click", function (data)
    {
        console.log("A batton was clicked, data = " + data.mess);
    });
});
 
var port = process.env.PORT || 3000;
 
http.listen(port, function ()
{
    console.log("Listening on ", port);
});


Рекомендую сразу протестировать на удалённом хостинге heroku.com. Можно создать 5 бесплатных приложений. Вот пошаговая инструкция: Getting Started on Heroku with Node.js

P.S. Перед отправкой на heroku нужно добавить в package.json строку: "start": "node app.js"

package.json
Кликните здесь для просмотра всего текста
JSON
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
{
  "name": "example",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1",
    "start": "node app.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.14.0",
    "shortid": "^2.2.6",
    "socket.io": "^1.7.2"
  }
}
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
21.01.2017, 03:55
Вот это всё:
Цитата Сообщение от 8Observer8 Посмотреть сообщение
npm install express --save
npm install socket.io --save
npm install shortid --save
можно записать одной командой.
npm i -S express socket.io shortid
1
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 07:29
Цитата Сообщение от BANO Посмотреть сообщение
можно записать одной командой.
Спасибо большое! Добавил отзыв в репутацию.
0
0 / 0 / 0
Регистрация: 13.01.2017
Сообщений: 17
21.01.2017, 11:57  [ТС]
Так я (как насколько понимаю) socket.io хорош в том что работает со всеми браузерами вообще, в т.ч. и со старыми (в которых нету поддержки штатных вебсокетов), в т.ч. и с мобильными теми из них где нету поддержки штатных вебсокетов. Во всём остальном (как я понял) хороши штатные вебсокеты.
Как обстоит сейчас дело, с поддержкой штатных вебсокетов в современных мобильных браузерах?
Время идёт, старые технологии уходят в прошлое, новые технологии внедряются и применяются. Имеет ли смысл, в этой ситуации, идти по пути этого старого socket.io?
Мне надо (хорошо, подробно) понять, на чём мне жениться сейчас - на socket.io, или на штатных вебсокетах.
"Негатива" от меня, никакого нету, и быть не может, т.к. я новичок в теме. Читаю информацию, пытаюсь вынести зерно истины. И та и та технология, оправдана (иначе, её бы просто не было). Мне надо понять, что сейчас лучше в текущей современной ситуации.
0
964 / 719 / 276
Регистрация: 10.12.2016
Сообщений: 1,764
21.01.2017, 12:19
посмотри по теме
https://www.youtube.com/watch?... vp191Hb3Gg
0
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 12:51
Цитата Сообщение от SilverSurfer Посмотреть сообщение
Так я (как насколько понимаю) socket.io хорош в том что работает со всеми браузерами вообще, в т.ч. и со старыми (в которых нету поддержки штатных вебсокетов), в т.ч. и с мобильными теми из них где нету поддержки штатных вебсокетов. Во всём остальном (как я понял) хороши штатные вебсокеты.
Возможно вы правы и штатные веб сокеты сейчас работают везде и на всех мобильных браузерах - я этим не интересовался. Я взял socket.io и прекрасно их использую и буду дальше использовать. Вам понравились штатные сокеты. Главное, что вы поняли как посылать сообщения от клиета к серверу и обратно. Значит, разницы никакой нет. Выбор - это только лишь дело вкуса. Переключитесь на решение других более важных проблем, на реализацию игр.
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
21.01.2017, 13:07
У них достаточная поддержка современных браузеров.

Вообще не надо забывать, что socket.io - просто абстракция над простыми сокетами. Для месседжера или других интересных вещей socket.io предоставляет достаточно удобный интерфес передачи json. Для каких-нибудь игр всё же наверное стоит брать чистые WebSocket. Ибо socket.io, как и любая абстракция, увеличивает пакеты данных и замедляет их передачу.
Это как с jq, там где не сильно важна скорость и трафик клиента, то можно спокойно использовать всякоразные карусельки да аккордеоны. А вот там, где эти аспекты важны, но не важно сколько времени и сил займёт разработка (то есть плата покрывает физические расходы), вот там как раз WS в самый раз будет.
0
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 13:28
JSON очень удобен для игр, особенно, когда ты начинающий и делаешь несильно активную игру, а RTS, карточные игры, или MMORPG. Такие типы игр допускают спокойно до 500 мсек задержек (между кликом и реакцией). На таких играх нужно тренироваться программировать, а потом какие-то игры можно делать WebSocket'ах, если это будет необходимо.
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
21.01.2017, 13:57
Ну карточные да, там спокойно. А вот такие как agar.io используют только чистый ws. В коде agar.io ещё используются буферы, чтобы максимально уменьшить размер пакета.
1
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 14:40
Откуда вы знаете, что они использую ws и буферы?
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
21.01.2017, 14:47
8Observer8, хотел сделать бота... потом забросил.
Был тут человек, то ли Tester6*, то ли ещё кто-то. Он хотел сделать свою игру на подобии этой. Он даже где-то достал код сервера.
И пробудил во мне интерес к этой игре... Я взял их минифицированный код и решил пробежаться по нему... Неблагодарное это дело конечно. Но в конце концов узнал как там всё устроено. Так же на хабре писалось. Там кто-то делал армию ботов.
0
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 15:50
Я сколько не пытался найти исходники оригинальной игры, так и ничего не получилось.

Нашёл только три клона, все они написаны на socket.io:
Я читаю несколько книг по сетевым играм. Там перечисляются и анализируются источники задержек. Причём размерам пакета не удиляется внимание. Задержки в любом случае будут, потому что большинство не имеют высокоскоростной интернет. Есть логические методы компенсации задержек: интерполяция позиций, предсказания, виртуальный локальный сервер на стороне клиента и много других способов, чтобы человек даже с 200 задержкой не чувствовал этого в активных играх. Это требует много практики и знаний. Тяжело изучать, но интересно. Раньше и не такие скорости интернета были и всё же были динамичные игры.
0
0 / 0 / 0
Регистрация: 13.01.2017
Сообщений: 17
21.01.2017, 16:01  [ТС]
1. Comet, мне не нужно. Клиент соединился с сервером по вебсокету - всё, дальше они общаются так. Серверно-инициированные вызовы какие-то дополнительно... зачем?
2. Кароч из написанного, понял что надо всё же переходить на штатные вебсокеты. Эволюция движется, а костыли-абстракции хороши только на начальном этапе, когда в браузерах не было поддержки. Сейчас, она есть.
3. По поводу "проще кодить". Тут просто надо сильно разжованные примеры и туториалы, выкладывать. Покопал, в данном плане сейчас негусто. Спасибо тем, кто сейчас мне дал ссылки на годные примеры. Сам я 1Сник, у нас сейчас всё программирование фактически сводится к открыл яндекс, нажал 3 кнопки, скопипастил.
4. Буферы и т.п. хитрости, нужны (имо) для, так сказать, "further optimization". Опять же, главное, чтобы не превращалось в "костыли". Сам пишу ККИ, пока мне всё это не нужно. Но всё же и депрекатед методы (third-party), мне тоже не нужны.
5. JSON, JQuery. Зачем мне это всё нужно для кодинга игр? Я не знаю (может быть, пока)
6. Чистый ws на ngrok, уже успешно оттестировал. Если нету грамотных минималистичных сэмплов, сегодня-завтра выложу разжованный сэмпл
0
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 16:50
Тут всё на ваше усмотрение. Я выбрал socket.io только потому что с ними оргомная куча примеров в инете по играм, что не тутор по мультиплееру, то socket.io

Цитата Сообщение от SilverSurfer Посмотреть сообщение
5. JSON, JQuery. Зачем мне это всё нужно для кодинга игр? Я не знаю (может быть, пока)
jQuery мне самому не нужно, во всяком, случае пока что, а JSON - это просто удобная плюшка для работы с пакетами. Пользоваться JSON или нет - это на ваше усмотрение. Если не нравится, то просто обходите JSON стороной. Я его постоянно использую и вижу что многие его используют, по скаченным примерам игр из сети.
0
964 / 719 / 276
Регистрация: 10.12.2016
Сообщений: 1,764
21.01.2017, 17:29
я эту тему начал копать когда, был удивлен тормозами в вебе. Делал когда-то сервер UDP рассылки с клиентским GUI, период обновления был 25 миллисек в реалтайме с графикой.
есть интересный пример на питоне - websocket с нуля
0
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 18:08
Я накопал, что игра tanx.io сделана на Websockets.
Используется игровой сервер Colyseus на
Node.js под бесплатной лицензией MIT.
Вот исходники сервера: https://github.com/gamestdio/colyseus
0
0 / 0 / 0
Регистрация: 13.01.2017
Сообщений: 17
21.01.2017, 20:23  [ТС]
8Observer8, а зачем мне работать с пакетами (JSON)? Вот подключилось клиент-сервер по вебсокету, и работает по нему. Дальнейшие оптимизации сетевого трафика, буду делать если они мне будут нужны.
0
Ренегат
Эксперт HTML/CSS
 Аватар для BANO
1740 / 1085 / 386
Регистрация: 06.08.2014
Сообщений: 5,203
Записей в блоге: 1
21.01.2017, 21:37
Цитата Сообщение от 8Observer8 Посмотреть сообщение
JSON - это просто удобная плюшка для работы с пакетами
На секундочку это формат хранения/передачи данных, принятый для js дефалтовым, ибо из него и вышел по сути, точнее из его синтаксиса.

SilverSurfer, json - формат данных. Не более. Надо различать. К форматам ещё относятся xml, yaml и ещё дофигищу было придумано под разные задачи. JSON просто удобно парсить в браузере. socket.io по дефалту использует этот формат для своих пакетов, ибо он там ещё хранит тип пакета и может ещё разную инфу хранить.
0
9954 / 2956 / 497
Регистрация: 05.10.2013
Сообщений: 8,081
Записей в блоге: 242
21.01.2017, 21:57
Цитата Сообщение от BANO Посмотреть сообщение
На секундочку это формат хранения/передачи данных, принятый для js дефалтовым, ибо из него и вышел по сути, точнее из его синтаксиса.
Я знаю, но TC не нравится JSON. Он может как-то по-своему будет передавать данные в другом формате.

Цитата Сообщение от SilverSurfer Посмотреть сообщение
а зачем мне работать с пакетами (JSON)? Вот подключилось клиент-сервер по вебсокету, и работает по нему.
Одну и туже задачу можно решать разными способоми. Я показывал пример выше, как я передаю данные, используя JSON-формат. По-моему, довольно наглядно:
JavaScript
1
socket.emit("button_click", { mess: "hello from client" });
А на сервере можно обратиться к полю объекта через точку:
JavaScript
1
2
3
4
socket.on("button_click", function (data)
    {
        console.log("A batton was clicked, data = " + data.mess);
    });
0
0 / 0 / 0
Регистрация: 13.01.2017
Сообщений: 17
21.01.2017, 23:20  [ТС]
Давайте отделим мух от котлет, и внесём ясность
1. JSON - формат передачи данных. Ок, понял вас. Что такое XML, я знаю, т.к. 1Сник я
2. Вот у меня сейчас работает сервер чистых вебсокетов, к нему подключаются клиенты. Между клиентами и сервером, идёт обмен текстовыми сообщениями (строками). Для отправки/приёма строк, юзаю штатные методы js-кода относящегося к работе с вебсокетами.
3. Нужно ли мне работать ещё и с самими пакетами, которые передаются по вебсокетам, с их форматом данных? По-моему, нет. По крайней мере, сейчас. Зачем мне это?
4. Нравится или не нравится мне формат передачи данных JSON - я (честно) не знаю. Так же как например, нравится или не нравится мне XML - ну, что-то мне в нём нравится, что-то нет.
5. Зачем мне JSON сейчас? Не знаю. По-моему, ни за чем, т.к. внутрь пакетов, не лезу.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
21.01.2017, 23:20

Клиент-серверная база(подключение через хостинг)
Здравствуйте. Я хотел создать клиент-серверная база. Создал базу на Phpmyadmin. Теперь хочется подключиться к базу через хостинга. Но не...

Клиент-серверная программа, работающая через broadcast
Помогите написать, пожалуйста. Программа должна установить пакеты с одного компьютера на другие, находящихся в сети. Например, установить...

Прошу совета у опытных людей. Цикл while и 2 условия через логическое или (or)
Есть код. В два счетчика попадают числа, не важно как. Я хотел, чтобы при выполнении одного из условий, программа выходила из цикла. В...

Доступ к базе через web-клиент и толстый клиент
Подскажите как можно организовать доступ к базе (файловой или клиент-сервер) одновременно черзе веб и через толстый клиенты? Если такое...

Прошу совета извлечь bin из старого PDB файла для PALM, возможно через VS2008
Всем привет ! Скажу сразу - я не программист, но нужно мне с этим разобраться. Есть файл PDB 63кБт, он идёт как файл прошивки к софту...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
40
Ответ Создать тему
Новые блоги и статьи
сукцессия 30. Фосфорный и азотный замки по "честному" закону лимитирования Либиха
anaschu 16.07.2026
Основные достижения за последние дни 1. Механизм отложенного высвобождения фосфора Добавлен специальный пул для медленного разложения меланизированных гиф ЕСМ Реализована разная скорость. . .
Запрет пометки на удаление и отмены проведения
Maks 16.07.2026
Алгоритм из решения ниже реализован на нетиповом документе "ПутевойЛист" разработанного в КА2. Задача: запретить помечать на удаление и отменять проведения путевого листа при условии, если он сдан. . .
Как надо было делать правильно - вообще не слушать ИИ, его дело - текст.
Hrethgir 15.07.2026
А вообще надо было делать не так, чтобы не исправлять ошибку https:/ / www. cyberforum. ru/ blogs/ 223907/ 10996. html , правильно было : удалил кнопку, а потом добавил её. Всё это стресс конечно. Почему?. . .
Знаете, от чего появляется стресс?
kumehtar 15.07.2026
Стресс появляется оттого, что вы, зная как поступить правильно, делаете наоборот. Ларри Уингет
Нас бьют, а мы крепчаем? Какая чушь!
kumehtar 15.07.2026
Вот это вот бытующее мнение, что человек меняется только под действием проблем, всегда считал вредоносным. Поверь, от проблем у людей появляются не изменения, а нервное расстройство и ПТСР. А. . .
сукцессия 29. Переход от одних деревьев на другие делать более или менее вероятностным?
anaschu 12.07.2026
Насколько смена типов микоризы — исключительное событие в двухвековой сукцессии? Оценка вероятности в пространстве параметров В текущей версии модели успешно реализован ключевой механизм. . .
сукцессия 27. Думаю, как переделывать уже написанную статью с планами на сукцессию.
anaschu 12.07.2026
Анализ соответствия модели требованиям Реализованные компоненты: Механизм закисления почвы через протонную помпу Конкуренция между типами микориз pH как триггер сукцессии C/ P соотношение. . .
Сукцессия 26. Мат модель создана.
anaschu 12.07.2026
Модель смены растительных сукцессий посредством управления грибами работает внутри небольшой ячейки почвы, восстанавливающейся после пожара, где ненадолго бывшее царство хвойных снова захватили. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru