Что такое Web Socket на примере Ratchet

Что такое Web Socket на примере Ratchet

Что такое веб сокеты

Если найти данное описание в гугле, то первой ссылкой будет Википедия. В которой определение звучит именно так:

WebSocket — протокол связи поверх TCP-соединения, предназначенный для обмена сообщениями между браузером и веб-сервером в режиме реального времени.

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

Все мы прекрасно знаем про ajax и повсеместно его используем. Но вот 2 задачи:

  1. Мы пишем чат (2 участника, 3, 4, 100 не важно)
  2. У нас сервис такси, и нужно у пользователя в приложении, а реальном времени обновлять положение автомобиля на карте (при этом координаты берутся от авто и через сервер, передаются клиенту)

Подобные задачи мы бы могли решить через ajax. Например, раз в секунду отправлять запрос на сервер и спрашивать, если какие данные. На что сервер возвращал бы эти данные, или false. Выглядело бы это вот так:


Подобный обмен называется ping-pong. Посмотрите один игрок – клиент, второй – сервер, мячик – это наш запрос.

Ну и что мы имеем. Постоянную нагрузку на сервер и трату ресурсов клиента, на постоянную проверку сервера. А так же нашу искусственную задержку по времени в одну секунду. А теперь представьте, что таких участников в чате 100. Это 100 постоянных запросов к серверу, которые могут оказаться совершенно пустыми и не нужными, но которые съедают свою долю ресурсов.

Что касается второго примера. Так наше авто на карте будет дёрганным, а его местоположение вообще не корректным.

Для решения этих двух задач нам на помощь и придут веб сокеты.

Если слишком простым языком, то технология веб советов позволяет двухстороннее слушание, т.е. сервер слушаем браузеры и браузеры начинают слушать сервер.

Если на сервере произойдут какие-то изменения, то он сможет отправить информацию об этом клиентам, при им на стороне клиента не было никакого ajax запроса, он просто слушал, что скажет сервер.

К сожалению, в PHP пока что нет решения по web socket из коробки и настроить веб сокеты в PHP можно только с помощью сторонних библиотек. В JS (java script) поддержка и настройка веб сокетов уже есть.

PHP библиотека Ratchet для web socket

Лично я использую библиотеку Retchet для настройки веб сокетов и работы с ними в PHP.

Давайте поиграем в ping pong но только без ajax и обновлением информации у клиентов в реальном времени.

Для этого вам на сервере нужно создать новый проект. Например websocket.

Перейти на официальный сайт Retchet и через композер (composer) установить библиотеку. По суи нуджно выполнить одну команду.

На официально сайте указанно php ~/composer.phar require cboden/ratchet

Но я использую: php composer require cboden/ratchet , заранее перейдя в проект.

Кстати, если у вас не установлен composer, то вам поможет вот эта статья.

После установки в вашем проекте должна появиться директория vendor. В ней и находится наша библиотека.

Теперь в корне проекта давайте создадим 3 файла: index.php , script.php , server.php

Index.php – будет отвечать за фронт, который отдаётся клиенту

Script.php – наш бекенд. Механизм обработки запросов на сервере.

Server.php механизм поддерживающий соединения между клиентами и сервером

Начнём с самого простого – index.php

Не забудьте подключить jQuery, хотя бы CDN


Как видите по сути наша стандартная HTML страница. Это просто 2 кнопки Ping и Pong, по их нажатию, будем отправлять данные на сервер, а тот рассылать это остальным клиентам.

Самое интересное здесь. Это соединение с сервером.


Обратите внимание. Несмотря на то, что наш проект на сервере называется websocket, мы всё равно стучимся в localhost, а порт 8080. И именно в корень localhost, а не в server.php или script.php, как можно подумать.

Так же мы имеем несколько интересных методов:

socket.onopen – что делать в случае удачного соединения

socket.onerror – что делать, если соединиться не удалось

socket.onmessage – когда пришло сообщение от сервера

socket.send – отправить сообщение на сервер

Со страницей index закончили. Давайте перейдём к script.php


Определяем пространство имён и, через use, подключаем нашу библиотеку

Далее создаём сам класс по работе с запросами. В классе мы будем реализовать методы интерфейса.

$clients – глобальная переменная, которая и будет у нас хранить наших клиентов.

Методы:

onOpen – Вызывается при подключении нового клиента

onClose – Вызывается при закрытии соединения

onError – Вызывается в случае ошибки

onMessage – Если пришло сообщение от клиента

Пока что, в рамках примера, нас интересует только кастомизация метода onMessage. Именно он отвечает за обработку запросов от клиентов. Например, тут вы можете сделать switch и перебирать команды от клиента и делать нужные действия на с данными и т.д.

Мы же сейчас просто разошлём пришедшие данные по клиентам. Т.е. просто перебираем текущих клиентов и отправляем $msg .

Напомню, что на стороне клиента у нас есть метод socket.onmessage, который слушает сервер, и когда наш ответ придёт, то socket.onmessage выведет ответ на страницу.

Теперь давайте напишем server.php


Тут всё просто. Просто подключаем через use нужные классы из библиотеки Ratchet, так же подключаем наш класс PingPong. Обязательно используем require этих двух файлом, чтобы сервер понимал, где эти классы искать.

Теперь создадим и запустим сам сервер. Укажем рабочий класс PingPong и порт 8080.

Вызвав функцию run() мы запускаем наш сервер веб сокетов.

Теперь перейдём в консоль и вызовем server.php


Теперь можем проверить, как всё работает. Откроем 2 браузера или один браузер и одно окно инкогнито. В обоих окнах перейдём по нашему домену. Должны увидеть 2 кнопки.


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

Теперь так же наживаем во втором.


По сути всё. Это и есть работа веб сокетом.

Разумеется, это максимально простой пример, но который прекрасно должен описать принцип работы обмена между клиентами в реальном времени. Разумеется, эта технология используется в более вложенных задачах. Но более сложные задачи и имеют логическую часть на PHP, сама технология обмена, та же самая как в данном примере.

Где не нужно использовать web socket

Как мы все уже увидели, эти очень мощный инструмент разработки. Но использовать его нужно далеко не везде. Например, у вас обычный интернет магазин, на котором есть несколько форм обратной связи, форма оформления заказа и кредитный калькулятор. Вот тут вам веб сокеты совершенно не нужны. Ваша задача заключается в отправке данных на сервер один раз и получить true или false.

Веб сокеты необходимо использовать там, где необходимо постоянное и непрерывное соединение с сервером. Например, навигатор, онлайн игра, чат (если в вашем магазине есть чат с продавцом, тут уже можно использовать web socket) и т.д.

С отправкой формы авторизации, справиться и обычный ajax. Для отображения котировок с биржи биткоина в реальном времени помогут сокеты.


it-blog.club 19
Автор: Ярослав Хмель


Если Вам понравилась статья, то можете поддержать блог переведя N сумму на кофе авторам или оплату хостинга!
В любом случае спасибо! А так же не забывайте про группу в ВК
ПОИСК ПО САЙТУ
Поддержать
Поддержать на Donationalerts
Мой контент смог тебе помочь?
Мой блог существует уже несколько лет и предоставляет контент бесплатно.
Но хостинг сам себя не оплатит. Думаю 30-50 рублей не такая большая сумма для тебя, но если поможет каждый.
То этот прекрасный блог сможет существовать дальше и в этом будет лично твоя заслуга.
А я лишь могу обещать стараться выкладывать новые решения, но без твоей поддержки это всё сложнее :(