Подтвердить что ты не робот

Angular2 + Laravel с Real Time & WebSockets

Я создал приложение, и я планирую начать битву в реальном времени с помощью Angular 2 и laravel. Например, вы нажимаете кнопку "атака", и ваш оппонент видит, как его жизнь снижается в реальном времени.

Мое приложение построено с помощью

интерфейс: Angular 2

Бэкэнд: PHP Laravel 5.2

Теперь я ищу и изучаю свой боевой компонент в реальном времени, и я видел для него разные руководства и учебные пособия:

Учебник first посвящен использованию Laravel 5 и socket io.

второй - использование Angular 2 с NODS JS и сокет io.

Когда я говорю в реальном времени, я имею в виду, что оба пользователя видят то же самое, что происходит на экране)

My Backend и Frontend полностью разделены, и у меня нет настроек с NodeJS в любом приложении.

Оба пользователя должны видеть действия, происходящие во время битвы в моем приложении, и нужно пройти через мой API-интерфейс laravel и показать его с помощью моего компонента Angular 2

Мой вопрос -

Какой лучший подход к приложениям реального времени (кажется, веб-сокеты), используя Angular2 и Laravel 5.2, чтобы получить желаемый результат того, чего я пытаюсь достичь?

Как?

4b9b3361

Ответ 1

Laravel в этом контексте - это просто шаблонирование и обслуживание клиентских файлов, а также взаимодействие между клиентом и сервером socket.io. Он фактически не работает как сервер socket.io, и я не думаю, что это возможно.

Итак, вам все равно нужно что-то (node), чтобы разместить сервер socket.io для взаимодействия с клиентом, через PHP или иным образом. Лично я вообще пропустил Laravel/PHP и просто использовал node с koa/express/whatever для создания шаблонов ваших файлов (html/js/css/etc). Мне кажется ненужной абстракцией.

Код ниже из socket.blade.php уже имеет соединение с фактическим сервером socket.io, поэтому я не понимаю, почему дополнительные накладные расходы HTTP POST через PHP/Laravel - хорошая идея. Безопасность, возможно, но вы можете справиться с этим с самим сервером socket.io.

var socket = io.connect('http://localhost:8890');
socket.on('message', function (data) {
    $( "#messages" ).append( "<p>"+data+"</p>" );
});

Ответ 2

Если вы планируете использовать websockets, то, похоже, меньше использования laravel, так как только один сокет довольно способен обрабатывать все данные, которые будут обмениваться между интерфейсом и бэкэнд, поэтому, если вы не возражаете изменить ваш двигатель вы можете попробовать Meteor, https://www.meteor.com/

Ответ 3

Для персонажа в реальном времени вашего прецедента, websockets, безусловно, путь. Игроки, которые должны получать обновления, должны находиться в одной и той же "комнате", чтобы вы могли легче транслировать изменения. Для других функций вы можете либо использовать websockets, либо обычные вызовы API для вашего бэкэнда непосредственно из вашего клиентского кода приложения с каким-то сообщением между вашим api и сервером сокетов, например. через Редис.

TL;DR:

  • Все данные через сокеты, сервер node делает api вызовы и транслирует изменения для активных игроков.
  • Используйте API напрямую из приложения, используйте pub/sub queue foo для связи между laravel и node для трансляции изменений для активных игроков.

Вариант 1:

  • Angular приложение frontend
    • Настройка подключения к веб-узлу.
    • Добавить триггеры для игры foo, которые будут отправлять данные по сокетному соединению и обрабатываются вашим сервером узлов
    • Только переговоры с сокетами
  • Node сервер
    • Служит для внешнего интерфейса
    • Обрабатывает соединения сокетов, разделяет игроков за игру.
    • Обрабатывает вызовы сокетов и вызовы laravel api, чтобы делать мутации на ваших данных.
    • Действия процесса и трансляции изменений для игроков в игре X
  • API REST Laravel
    • Auth x
    • По умолчанию CRUD foo

Вариант 2:

  • Angular приложение frontend
    • Прямой разговор с api
    • Использование сокетов для прослушивания обновлений
  • Node сервер
    • Служит для внешнего интерфейса
    • Обработка данных websocket
    • Прослушивание очереди для опубликованных данных из API
    • Трансляция изменений для игроков в игре x over socket
  • API REST Laravel
    • Auth
    • Crud
    • Триггеры Mutation x публикуют в Redis или в другой очереди, которые сервер node может/должен прослушивать

Я уверен, что есть еще несколько способов настроить это, вам просто нужно решить, где вы хотите. Возможно, введение Redis - это то, чего вы не хотите, в этом случае ваше приложение node будет иметь больше возможностей. Если вы хотите использовать что-то вроде Redis, вам нужно будет делать вызовы API из вашего внешнего приложения или в любом случае делать это через приложение node, объединяя два варианта.