Websocket (вебсокеты): связка PHP + JavaScript. 30-ти минутка совместной разработки.

Websocket и это относительно новая и очень интересная технология, позволяющая реализовать двусторонний обмен данными между клиентом и сервером в режиме реального времени. Без websocket`оф если клиенту нужны свежие данные, то ему необходимо сначала сделать запрос на сервер. Если клиенту нужны данные каждый несколько секунд, то это порождает лавину запросов, представьте, что 1000 человек каждую секунду генерируют по запросу.
2:54 Подготовка
5:55 Backend часть
11:55 Frontend часть
27:55 Итоговый результат
Буду рад поддержке: лайк, комментарий (адекватная критика тоже приветствуется), денюжка - все мотивирует в плюс.
www.donationalerts.com/r/andr... - кошелек.

[@yaolegoleynik]

Невероятно простое и понятное видео, спасибо большое!

[@user-jm8lz8qh4m]

Благодарю за видео! Как раз по вашему примеру на рабочем проекте и внедрял вебсокеты!) И все благополучно "завелось"!

[@user-yd9nq1ub1x]

Огромная благодарность за это! Приятно смотреть и слушать. Все четко, с толком, понятно и доступно))) Подписываюсь))

[@MRX-fy4vt]

Спасибо, хороший контент! Сделайте пожалуйста видео о настройке вебсокета на Swoole PHP

[@chingiskuular1013]

Приятный комментатор! Речь ровная и спокойная.

[@user-gy2bs8uv7o]

Это ты комментатор:D

[@artemidiumter6543]

Спасибо за урок) пошёл делать крестики-нолики

[@mumusus]

Спасибо, всё просто и доходчиво

[@giuseppe2712]

Хорошее видео. Спасибо!🔥 Добавил в сохраненные себе

[@danila7333]

СПАСИБО! Здоровья тебе!

[@youtubeyh]

Спасибо, интересное и полезное видео, лайк подписка. Снимай больше про сокеты. Дополнительный текст для веса комментария для поддержки канала.

[@statdotastaff6193]

Топ контент, спасибо! Андрей подскажи как с защитой, можно ли "грабить" данные которые отдаются по сокетам и как от этого защититься?

[@11-april]

Спасибо автору. Рекомендую обернуть обработчик нажатия клавиши в ещё callbac onopen объекта WebSocket, чтобы наверняка дождаться подключения пользователя.

[@dmitry_kalugin]

для управления положением окон удобны комбинации Win+Arrow и Shift+Win+[Left/Right Arrow]

[@user-lh9wz4hi5z]

спасибо за освещение workerman. а то наслышан только про ratchet

[@blook1413]

спасибо, ждем подробности о продаже апликух)

[@romeocapuletti2425]

Pavel Durov, that is awesome! THX))

[@user-wz6yb6cp7o]

Pavel Durov is much smarter and rich, Iam just Andrei Shestakov.

[@EvilGazz]

Спасибо! Полезно!

[@user-oj5gu3zd6u]

Вы молодец! Подписался

[@akik6713]

Спасибо, лучший

[@egorsmorgunov8024]

гениально и просто. Вам надо в преподаватели идти.

[@vadimdorokhov8375]

Круто, спасибо)

[@fullfree1812]

Респект!

[@salikhov_id]

спасибо большое!

[@baurbaur332]

Вау прекол, пасибо чел.

[@PoulFly]

Спасибо за видео, вопросик а если будет онлайн 1000 человек то такой подход норм? Сервак не ляжет? И тут реализация для одного типа соединения, а как на счет если у нас будет, чат, какие-то уведомления, дополнительно синхронизация действий на редактирование статей и тд, то в таком случае workerman разрулит?

[@user-xk9ub3eo3m]

Спасибо!

[@grigoriymalyshev4782]

Спасибо за отличное объяснение! Непонятным осталось одно: что делает count? Дока по workerman нашлась только на китайском.

[@TheDamage1982]

Добрый день! Так нужно чтобы на клиенте был уже установлен node и глобально http-server?

[@redhook777]

Спасибо)

[@user-qg4qz8qo2c]

Класс! Очень интересная технология!

[@pro100chok]

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

[@stolz999]

Простой чатик на двоих может и не хуже. Непонятно как поддерживать живым процесс сервера

[@user-to4ke3df3v]

Круто!

[@ngkq5403]

Здравствуйте как запустить скрипта Workerman на виртуальном хостинге?

[@mushnikov35]

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

[@khartower]

вопрос, данные сокеты работают по https (wss)? Если да то как, эту тему редко кто освещает

[@Pavelbrov]

Спасибо, очень доходчиво, ещё было бы круто, если бы добавили про каналы (channel) и подписки(subscribe)

[@user-sf2ym1ht2g]

Интересно. Расскажи о продаже флешь игор.

[@doyouknow_that]

Привет на OpenServer не вышло( пишет в js файле неверное соединение к сокету. Естсетвенно вокерман добавил в проект

[@vitalik5743]

А что с качеством?

[@gudvin2001]

и как этот одтдельно запущенный процесс, который будет выступать вебсокет сервером администрировать на реальном сайте?

[@StudioBaraban]

Добрый день, Андрей! Спасибо за видео! Можно ли купить у тебя личную консультацию и сколько стоит? У меня не получается подключиться к Binance Api через Websockets на php!

[@user-wz6yb6cp7o]

Доброго дня. С Binance Api не знаком, к сожалению. В настоящий момент весьма загружен, чтобы дельно помочь, извиняюсь. Но если сузите и конкретизируете вопрос, то может что смогу заметить. На каком этапе проблематика?

[@StudioBaraban]

Я запустил у себя на сервере workerman. А дальше не понимаю - как его сделать клиентом. Чтобы Php слушал чужой сервер (binance)

[@user-wz6yb6cp7o]

@@StudioBaraban здесь, конечно, нужно копать. Мне кажется Вам не нужен workerman или я не понял задумку. Workerman нужен для поднятия на PHP своего сервера, поддерживающего протокол websocket`a. Во всяком случае в видео я показываю именно его в использовании как серверной части. Может там как-то можно и php клиента инициировать, не пробовал. 1. У Biannce API есть endpoint по протоколу websocket`ов: binance-docs.github.io/apidocs/websocket_api/en/#change-log 2. Нужно подключиться к их endpoint`у и слушать сообщения. Для этого много готовых пакетов на github, по ключевой фразе: php websocket. Например, вот статья с примером какой-то библиотеки: www.piesocket.com/blog/php-websocket

[@grokgustavo]

Спасибо, каков ваш опыт на php и на каком стэке в основном работаете? Ради интереса спрашиваю.

[@user-wz6yb6cp7o]

В коммерческой разработке лет 8. Стек на работе: PHP: Symfony, JS: vueJS + legacy jquery, БД: postgres.

[@wyeth228]

Что делать если команы start, status и другие не работают. У меня тот же код, использую php 8

[@cleverscript]

Супер, получилось повторить на OpenSrver. Но возникает вопрос, а как поддерживать этот процесс на сервере постоянно? Например после перезагрузки сервера? Нужно команду php server/server.php стартануть заново, но как? На Unit systemd сервисе или как это решается?

[@user-wz6yb6cp7o]

Да, systemd, либо рестарта системы поддерживаются на уровне кубернетиса.

[@romanmed9035]

а чтобы не все все видели, а конкретный клиент с центром и другой клиент с центром и между собой они никак?

[@user-lm7pb3os8y]

13:01 вся соль, которой мы хотим добиться

[@krepkovmeste]

Подскажи пожалуйста, а как можно решить простую задачу, чтобы когда данные какие-то приходят и добавляются в базу, можно было клиентам сразу их выдать, но без постоянных запросов, по типу ajax запросов с помощью setInterval через n количество секунд. Есть старенький event source, но не понимаю он может реагировать на события или нет. В Интернете совсем нет никаких примеров, а сам сколько бы не тыкался, всё равно не получается, именно отреагировать на отправку данных при определёном событии

[@user-wz6yb6cp7o]

Ваш вопрос лежит больше в плоскости инфраструктуры, нежели программирования, но решение в целом есть, но это не супер просто. 1. Для связки клиент-сервер можно использовать протокол WebSocket`a или EventSource - это два разных подхода, они оба подойдут для цели уведомить клиента (браузер) с сервера. 2. А вот базы данных, как правило, напрямую не умеют сами уведомлять внешние процессы об изменениях (о появлении новых записей), поэтому обычно схема такая: - в инфраструктуру добавляется брокер сообщений, например RabbitMQ - на каждое соединение от клиента - поднимается программно отдельная очередь. - предположу, что добавление записей в базу происходит тоже через слой приложения. Поэтому при добавлении новой записи в базу, также создается и сообщение, отправляемое во все (fanout exchange) открытые очереди. - серверные скрипты, к которым в фоне подключены клиенты подписаны каждый соответственно на свою очередь и по событию добавления записи могут уведомлять клиента. В общем - ответ лежит в области применения брокеров сообщений и очередей. Если с этой темой пока не знакомы, то стоит как-нибудь на досуге туда копнуть.

[@user-wz6yb6cp7o]

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

[@kind1y]

Топчик! А какие проблемы могут возникнуть с утечками памяти и не только, если подымать свой сервер? Отдельный бы урок пожалуйста)

[@trismegistos1s]

привет. ты не нашел ответ на свой вопрос?

[@kind1y]

@@trismegistos1s неа :(

[@trismegistos1s]

@@kind1y я хочу из сайта сделать приложение, чттобы вебсокет контент обновлял да и уведомления посылала. ларавел нодежс не потяну, тупой слишком, но тут вроде всё просто. вот не знаю тоже пробовать это или нет

[@pantydev]

Протестировал ваш пример на OpenServer локально, всё работает, спасибо! Теперь хотелось бы узнать как сделать подключение внешне? Имею внешний IP, указал его в подключении к серверу на стороне клиента, порт 2346 открыл. Соединение происходит только через мобильный интернет, данные на сервер идут, сообщение о подключении есть, однако передача сообщений с сервера на клиент в таком случае отстутствует почему-то.

[@user-wz6yb6cp7o]

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

[@pantydev]

@@user-wz6yb6cp7o итак, Не могу утверждать наверняка - нужна перепроверка. Мы тестировали с другом, и то что я описывал выше относилось к его проверкам. Когда я самостоятельно решил проверить через свой моб. инет, выяснилось что проблема заключалась в максимально банальном. Банально - в браузере моб. телефона оставался старый кэш, и после его очистки все отлично работало. Панели разработчика там нет, поэтому функции disable cache тоже нет соответственно. Пришлось в ручную удалять. Осталось проверить удаленно у друга, так ли это.

[@pantydev]

@@user-wz6yb6cp7o извините за такую тупость. Иногда бывает часами сижу над проблемами которые фиксятся очень быстро x)

[@user-wz6yb6cp7o]

@@pantydev, не переживайте на данный счёт. Это у всех разработчиков бывает в той или иной мере.

[@millenial1584]

Здравствуйте! Можете подсказать, как исправить такую ошибку? PHP Fatal error: Uncaught Error: Call to undefined function posix_getpid() in /home/a0396279/domains/koprik.uz/public_html/vendor/workerman/workerman/Worker.php:2128

[@SergeyShuchkin]

на windows ? if (!function_exists('posix_getpid')) { function posix_getpid() { return getmypid(); } }

[@IbragimIbragim-lw1fs]

а как такой скрипт запустить на сервере, или как это работает на хостинге?

[@khartower]

никак

[@borismakhmudov896]

Андрей, можете пожалуйста объяснить как отправлять конкретному пользователю (личное сообщения)

[@user-wz6yb6cp7o]

Приветствую. Чтобы отправлять запросы определенному клиенту - нужно сопоставить соединению клиента некий уникальный идентификатор. Можно сделать так: 1. 7:55 - когда клиент подключился, в этом методе на сервере генерируем уникальный идентификатор. Если по простому это может быть uuid, в php есть библиотеки для его генерации. Или для легкости эксперимента - просто число. 2. Сразу клиенту передаем через метод $connection->send сообщение с этим идеентификатором. Сообщения нужно делать разными и заворачивать в формат JSON. Плюс на сервере создаем некий справочник соответствий (ассоциативный массив): "идентификатор клиента" => $connection (объект соединения) 3. 24:19 - клиент может получить JSON, преобразовать его в объект, вытащить идентификатор и запомнить его. Все. Если клиент отправляет на сервер любой запрос, то прикладывает к нему свой идентификатор. Если сервер хочет отправить сообщение определенному клиенту, то по справочнику находит нужное соединение и шлет сообщение именно ему. Если по правильному, то вместо идентификатора должен генерироваться некий шифрованный токен, который на каждом ообращении от клиента будет проверяться сервером, но это уже другая история. Если конкретно для примера личных сообщений, то еще раз кратко: 1. Клиент подключился - назначаем ему какой-то идентификатор. 2. Когда клиент хочет отправить личное сообщение - передаем на сервер идентификатор отправителя и получателя. 3. На сервер по сформированному справочнику находим соединение получателя и шлем конкретно ему.

[@borismakhmudov896]

@@user-wz6yb6cp7o Что лучше Ratchet или Workerman?

[@borismakhmudov896]

@@user-wz6yb6cp7o можете записать вторую часть на счет данной темы, не со всем понятно

[@user-wz6yb6cp7o]

@@borismakhmudov896 В боевой среде использовать эти библиотеки не приходил, только на уровне экспериментов. Но я бы более рекомендовал Workerman, так как у него нет никаких зависимостей внутри от сторонних библиотек в отличии от Ratchet. Плюс по показателям на github сообщество вокруг Workerman более живое в моменте. По вопросу - продолжения темы WebSocket и примера личных сообщений - возможно, но обещать пока не могу.

[@borismakhmudov896]

@@user-wz6yb6cp7o в ютубе нету ни одного видео по этой теме, как отправка конкретному пользователю. У многим похожи пример и всё, дальше никто не заходил, так что тема не раскрыта.

[@user-rm6nb2sx6c]

25:59 тут не баг. чтобы такого не было, надо убрать лишние процессы: $wsWorker->count = 1;

[@popov.artem1205]

Да, без $wsWorker->count = 1 не работает. Спасибо огромное за подсказку!

[@Fhkbsthn]

Не могли бы вы на github выложить код?

[@user-wz6yb6cp7o]

Да, конечно: github.com/aashestakov/workerman-sample2

[@Hrachik333]

А ведь можно вместо nodejs сервер использовать к примеру apache2?

[@user-wz6yb6cp7o]

Здравствуйте. NodeJS сервер и Apache в целом очень разные по идее концепции, они не являются альтернативой друг другу. В видео я, вероятно, говорил про NodeJS в контексте того, чтобы транспилировать JS код в совместимый с браузерами.

[@devracoon]

Все таки пхп создан, чтобы умирать) P.S: Речь про демонизацию процессов на ПХП (WS сервер)

[@user-wz6yb6cp7o]

Тема холиварная =) Есть ряд технических факторов, когда процесс на PHP очень даже подходящее решение в срезе переменных трудозатрат: времени/цены/сложности. Скажем так, табу здесь нет и лучшим решением является рассмотрение конкретных кейсов, когда PHP демон применим, а когда лучше выбирать альтернативу. В абстрактной форме ультимативные утверждения обычно нежизнеспособны. Это относится, как к программированию, так и жизненным подходам, пожалуй. Но это так, философские рассуждения в никуда =)

[@NikK0lay]

На PHP? Зачем? Можно же на node?

[@olkhagaming4053]

Сразу несколько вопросов. 1. Для достаточно простого приложения цепляется фреймворк в сотни файлов. Так ли это необходимо? 2. Возможна ли реализация используя функциональное программирование? 3. Как осуществлять аутентификацию пользователей использующих сокеты?

[@sergpozi]

Добрый вечер! Как такой скрипт запустить на хостинге?

[@user-wz6yb6cp7o]

Добрый. Не уверен, что верно понял контекст вопроса, но все же. 1. Смотря какой хостинг, если урезанный shared хостинг, то могут быть ограничения на исполнение долгоживущего worker`a. 2. Если мы говорим про полноценный VPS под Unix системой, то долгоживующие воркеры PHP обычно запускаются при старт системы, а поддерживаются, как вариант, утилитой supervisord, чтобы перезапускать вокрера при падении. Тогда мы получим стабильный процесс, ожидающий соединения по протоколу websocket.

[@sergpozi]

@@user-wz6yb6cp7o Понял, спасибо) А продолжения по Websocket случайно не будет? Чтобы можно было например создать несколько "комнат" и в каждой комнате своя жизнь, что-то на подобии многопользовательской игры.

[@user-wz6yb6cp7o]

@@sergpozi точно будет про PHP в плане best practice (хороших практик). Webscocket тема интересная - возможно вернусь к ней в январе, но обещать точно пока не могу.

[@youtubeyh]

@@user-wz6yb6cp7o Уже январь, возвращайтесь. =)

[@ndorerahojules5926]

Привет...мне нужна ваша помощь по вебсокету...ошибка возникла

[@user-wz6yb6cp7o]

Приветствую. Извиняюсь, скажу откровенно, что пока очень загружен, времени провести частный разбор ситуаций не смогу найти.

[@ndorerahojules5926]

@@user-wz6yb6cp7o хорошо.. но мой вопрос может быть простой...как запустить рачет на удалённом сервере???

[@iMarkusUS]

Почему так : почему бы не выложить пакет кода

[@Igramant]

Бля, что ж такое, у меня пишет WebSocket connection to ws://0.0.0.0:2346 failed.... Unexpected response code: 200, В чем может быть проблема? У меня стоит Open server, и еще проблемы были с Node JS, через windows консоль все делал, может из за этого?

[@sergeys1976]

Вы случайно не решили эту проблему? А то я уже неделю пытаюсь ее решить и ни как.

[@ilnard]

Клон Павла Дурова?

[@user-wz6yb6cp7o]

Хорошо хоть не клоУн :-)

[@crogot]

Обработка движения одна лишняя, нужно оставить только по сообщению, иначе при нажатии клавиши движение обрабатывается 2 раза, по событию клавиши и потом ещё раз по сообщению от сокета, либо проверять и не обрабатывать сообщения от себя самого (делать проверку по дополнительном полю - инициатор движения)

[@deutschc9058]

это бек или фронт?

[@user-wz6yb6cp7o]

В видео есть обе части. 1. Backend часть - это php библиотека Workerman, которая в нашем случае просто слушает сообщения и ретранслирует их клиентам. 2. Фронт часть на JS - это клиент, коим является браузер.

[@deutschc9058]

@@user-wz6yb6cp7o спасибо.

[@deutschc9058]

очень мелко код, но все-равно сапсибо

[@user-wk6jm7nk5z]

чел все классно - ты экран для себя пишешь - слабо шрифт раз в 10 увеличить

[@user-wz6yb6cp7o]

Да, недочет. В следующих записях исправил проблему мелкого шрифта.

[@user-jp8qy8fb6e]

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

[@user-wz6yb6cp7o]

Фуфломет, зачёт :-)

[@prorevalution9522]

халтура

[@user-wz6yb6cp7o]

:-(