Знакомство с WebSocket

Поделиться
HTML-код
  • Опубликовано: 15 ноя 2024

Комментарии • 121

  • @personamems
    @personamems 5 лет назад +12

    Спасибо! Один из лучших уроков по теме! Очень эффектное оформление клиента и в тоже время очень простое.

  • @МакарЛеонов-л1и
    @МакарЛеонов-л1и 9 месяцев назад

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

  • @jolly_dev
    @jolly_dev 5 лет назад +10

    Спасибо за начальные знания, далее будем изучать сами. Отличное видео!

  • @sashashad
    @sashashad 2 года назад

    Видео требует некоторого бэкграунда, но в целом очень полезно. Если с кодом хоть немного работали то всё очень ясно.
    Спасибо!

  • @АлександрЖарков-у9ш
    @АлександрЖарков-у9ш 3 года назад +1

    Благодарю за информативное видео. Всё четко, ясно и по делу

  • @ful_kush
    @ful_kush 2 года назад

    Слишком просто для темы, которой я боялся )
    Благодарю за то, что ёмко и без воды

  • @yuragorb4220
    @yuragorb4220 4 года назад +6

    Все сделал как на видео, но когда ввожу в строку браузера - localhost:8080, открывается Index of/. В чем может быть проблема?

  • @vasiliykrush2150
    @vasiliykrush2150 4 года назад +3

    Голос хороший и все понятно, буду смотреть и другие ролики;)

  • @mikhail-zotchik
    @mikhail-zotchik 4 года назад +2

    Огромное спасибо за видео!

  • @boss-rus
    @boss-rus Год назад

    круто. коротко, ясно и работает :)

  • @aktotuttttt
    @aktotuttttt 3 года назад +3

    @CodeDojo почему мне возвращает [Object Blob] ??? Как починить?

  • @19n1ght
    @19n1ght 6 лет назад +7

    Спасибо, хорошее видео!
    Было бы интересно послушать про JSON-RPC, как альтернативу REST API.

  • @elvinmammadov8584
    @elvinmammadov8584 3 года назад +3

    i run command http-server , but error occurred : http-server : The term 'http-server' is not recognized as the name of a cmdlet, function, script file, or operable
    program

    • @nepcz
      @nepcz 2 месяца назад

      npm install --global http-server

  • @sergejsviridov141
    @sergejsviridov141 2 года назад +1

    как сделать чтобы веб сокет общался отдельно с каждым клиентом в пределах id клиента? т е чтобы отдельный клиент открыв два экземпляра страницы в разных браузерах мог через каждую из этих страниц в отдельности управлять событиями на обеих страницах?

  • @apexlegendsnemez
    @apexlegendsnemez Год назад

    СУПЕР РОЛИК !!!

  • @АльбертРобертович-ж7д

    какой приятный английский

  • @cassinid8843
    @cassinid8843 5 лет назад +2

    Спасибо, очень доступно.

  • @andyanderson222
    @andyanderson222 3 года назад

    Классный урок! Спасибо!

  • @maniakm897
    @maniakm897 5 лет назад +2

    А к этому серверу можно подключится например через другой ПК, который находиться в одной локальной сети с хостом-ПК (на нем запущен сервер) путем ввода в браузере серого IP адреса хоста и потом через : номер порта - 8080 ?

    • @eldarkhaitov6728
      @eldarkhaitov6728 5 лет назад

      Да, но надо сначала открыть порт 8080 на локальную сеть

  • @ryzhovdtv
    @ryzhovdtv 5 лет назад +1

    Спасибо за видео, когда попробовал первый раз на десятке все работало, а сейчас когда захожу на localhost:8080 выдает ERR-INVALID_REDIRECT, не подскажите как решить?

  • @StanislavM-j9x
    @StanislavM-j9x 3 года назад +1

    Кайф, спасибо!

  • @rugeneus
    @rugeneus 3 года назад +1

    Круто! Класс!

  • @rolton6307
    @rolton6307 2 года назад +2

    что делать если команда http-server не работает

    • @devope
      @devope 2 года назад +1

      npm install -g http-server

  • @РузельАбдурахманов

    Спасибо, отличное видео 👍

  • @glockwilder5973
    @glockwilder5973 4 года назад +2

    сначала написало в терминале что http-server нет такой команды. потом установил через нпм install http-server все прикрасно вроде все работает но после того я зашел в браузер на localhost:8080 и мне открыло index of/ и там мои файлы. Братик что за ошибка

    • @yuragorb4220
      @yuragorb4220 4 года назад

      У меня точно также.

    • @Blenberg
      @Blenberg 2 года назад

      Кто нибудь нашел ошибку?

  • @volodymyrdonets4166
    @volodymyrdonets4166 5 лет назад +1

    Спасибо чувак ты лучший!
    Нашёл пример кода не запускается (влом разбираться, опыта разработки JavaScript, Node.js и прочей не канонической мути нет, а сервер на WebSocket-ах сам себя не запустит).
    спустя 1.24 мин нахожу комманду npm install --save ws и вкинул библиотеку WebSocket-ов и Node.js запахал.
    Хацкер в деле)

  • @singlebw4065
    @singlebw4065 4 года назад

    Кажется я не понимаю что такое сервер. Я сижу в ковыряю React (запущенный сервер) так же использую бэкенд на express (запущенный сервер). Обратиться к бд использую OpenServer (запущенный сервер) :)) вот я вижу WebSocket и требуется создать сервер. Я вижу что посылаются запросы и приходит ответ, но понять как это устроено и что за магия твориться мне не понятно. Точнее я не задумывался глубоко. У меня в мыслях просто разделение фронтенд и бэкенд и возникает вопрос если у меня запущен localhost:4000 на express, то WebSocket можно ли завязать на этот скажем так сервер? Ткните носом где я не понимаю

  • @fnShun
    @fnShun 5 лет назад +5

    Кто может разъяснить несколько моментов: зачем используется http-server, если, как говорят источники, WebSocket работает поверх TCP. Какое отношение app.js имеет к http-server? И как общение происходит на порту 8080, если был указан 3000. Спасибо заранее)

    • @batradzbazzaev
      @batradzbazzaev 2 года назад +2

      3000 это порт вебсокета на сервере. 8080 это http порт. При открытом соединении 3000 порт перехватывает http запрос и обрабатывает его

  • @GrafAlexder13
    @GrafAlexder13 4 года назад

    свойство clients , где о нём можно прочитать? Как и где можно узнать какие свойства есть у ws ?

  • @imbaquad
    @imbaquad 4 года назад +1

    Отлично поданный урок. Все четко и ясно. Скажите, приемлемо ли использовать вебсокеты в чатах, предположим, в 100к и более онлайн пользователей? или тут лучше что-то другое рассмотреть? Спасибо!

  • @grot9017
    @grot9017 6 лет назад +1

    почему мы подключаем модуль через директиву require, а не import? Чтобы это сделать нам нужно было бы дополнительно подключить babel?

    • @codedojo
      @codedojo  6 лет назад +1

      Да, кроме модулей в Node.js можно использовать все остальные нововведения без Babel. Не вижу большого смысла включать его в проект только ради import/export.

  • @inji4579
    @inji4579 3 года назад

    Не выдержал в конце, таки написал adsdfsd)))

  • @danixpuh7073
    @danixpuh7073 3 года назад +2

    Есть большая проблема: почему когда я отправляю на сервер сообщение "Hello", назад я получаю [objectBlob]?

    • @АндрейКонстантинов-ж6ш
      @АндрейКонстантинов-ж6ш 3 года назад +4

      client.send(message.toString()); при отправке сообщения с сервера. Может кому еще пригодиться кто делать будет.

    • @danixpuh7073
      @danixpuh7073 3 года назад

      @@АндрейКонстантинов-ж6ш Спасибо огромное! Очень помогло! Прям выручили)

    • @АндрейКонстантинов-ж6ш
      @АндрейКонстантинов-ж6ш 2 года назад

      @@danixpuh7073 Пожалуйста! Считаю что таким нужно делится всегда! Очень часто по началу сталкивался с вопросами и ответа приходилось искать очень долго. А так, мне не сложно, сам разобрался и написал. Добро всегда добром вернётся! Успехов!

    • @finishsuffering
      @finishsuffering 2 года назад

      @@АндрейКонстантинов-ж6ш почему вы удалили сообщение, где помогли?

    • @АндрейКонстантинов-ж6ш
      @АндрейКонстантинов-ж6ш 2 года назад

      @@finishsuffering самое первое сообщение в ветке

  • @danixfax9800
    @danixfax9800 3 года назад

    Не работает вообще, указывает в файле server.js на первую строку на document, принимает как за ошибку, почему так?

  • @gigabek
    @gigabek 6 лет назад +2

    Видео хорошее, но у меня вопросы (они больше относятся к бэкэнду). В каком виде у тебя отправляются/приходят сообщения - JSON, XML? Также для истории сообщений нужна БД. В своем примере, я использую Redis, но он занимает RAM и допустим мое приложение в деплое, то мой сервер упадет если будет много клиентов. Собственно как с Redis'а переместить историю в БД, и чтоб он фетчил данные или использовать другую БД?

    • @אדיל-ו2ת
      @אדיל-ו2ת 5 лет назад

      Блин как мне интересен этот вопрос тоже... Нашел решения?

    • @YukimuraChristian
      @YukimuraChristian 5 лет назад

      Там просто создается по сокету элемент li на html страничке, его значение хранится в переменной value, и при вызове кидает на html новые value и обнуляется).
      Никакой бд там нет. И не всегда нужна бд. На подобную деятельность будет рациональнее структуру данных запилить, аля стека. Либо читать с txt. Ну и да, дальше если начинать извращаться то JSON, CSV и т.п.

  • @maxgambler4983
    @maxgambler4983 2 года назад

    Вкладывать обработчик message в обработчик connect не только не нужно, но и вредно, так как при автоматическом переподключении вы задвоите обработчик message

  • @TeaWillHelp
    @TeaWillHelp Год назад

    Спасибо ^_^

  • @VladislavBarsukov-s2s
    @VladislavBarsukov-s2s 6 лет назад

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

  • @hmmm1482
    @hmmm1482 4 года назад +1

    Как на линуксе вебсокеты установить? npm install --save ws не работает

    • @shohijahonaxmetov
      @shohijahonaxmetov 3 года назад +1

      Sperva nujno ustanovit sam npm. Ustanovi nodejs s oficialnogo sayta v komplekte idet i npm

  • @faramozayw1654
    @faramozayw1654 5 лет назад +2

    Можно просто написать: npm i --save ws . Где-то читал, что npm i ws будет делать то же, что и npm i --save ws, но первый вариант куда короче

    • @hakooplayplay3212
      @hakooplayplay3212 4 года назад

      save уже не нужен, npm сохраняет зависимости по дефолту

  • @vesh95
    @vesh95 6 лет назад +2

    Веб сокеты - относительно новая технология)))
    Насколько я помню еще на первом курсе чат на них писал. Но всеравно это не первое появление.

    • @codedojo
      @codedojo  6 лет назад

      Сравнивая с HTTP, WS относительно новая технология.

  • @torodinson5260
    @torodinson5260 5 лет назад

    а зачем было через http-сервер запускать ? чтоб не обрабатывать гет и пост запросы ? через порт 3000 не запустился файл .

  • @Yura3zzz
    @Yura3zzz 6 лет назад +2

    Что насчёт авторизации, аутентификации? Например я хочу через вебсокеты подключиться к внешней системе, которая выдала мне логин и пароль. Я же не могу пароль просто прописать в js на сайте. Как его можно спрятать?

    • @LiguidCool
      @LiguidCool 6 лет назад

      У вас же пользователь не отсылает КАЖДЫЙ раз пароль при запросе страниц? Авторизация идет по кукису например. Тут подход тот же - у клиента есть id сессии, полученный при логине например, и оно же хранится на сервере.

    • @Yura3zzz
      @Yura3zzz 6 лет назад

      Вся проблема в том, что сервис не мой IBM , а страница моя. И куки тоже мои. IBM выдал креденшинл, который надо прописать в js чтоб общаться через mqtt over websosket. Вот куда их запихнуть, ума не приложу. Так чтоб при просмотре исходного кода страницы не было видно.
      Гугл как-то ж делает без сессии

    • @ccc3948
      @ccc3948 6 лет назад +1

      Если ваш ключ секретный, то запихнуть только на ваш сервер. Что-то вроде: страница -> [ws server -> ws client on server] -> ws server ibm
      - в скобках - то, что на ваашем сервере, там же и приватній ключ хранить

  • @ixtirochiavlodlar
    @ixtirochiavlodlar 6 лет назад

    Классный урок

  • @miralirafiyev4646
    @miralirafiyev4646 6 лет назад +9

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

  • @lessons3141
    @lessons3141 2 года назад

    супер

  • @maxon5944
    @maxon5944 4 дня назад

    у меня на странице выводиться Upgrade Required

  • @АлександрИванов-ц6ф4в

    одно непонятно а причем тут форма -- а если я просто хочу отправить какой нить инпут без формы или вааще чо то отправить по событию

    • @nepcz
      @nepcz 2 месяца назад

      Это просто один из способов. Можно и без формы. Добавь событие клик на кнопку и слушай его. Хотя мой ответ не актуален наверное)))

  • @yennms5547
    @yennms5547 2 года назад

    Это конечно круто все, но вам настолько лень запушить файл server.js, а не оставлять его пустым?)

  • @akkaynt8910
    @akkaynt8910 Год назад

    Слушает порт 3000 а переходит по 8080, почему?

  • @alexUnion
    @alexUnion 5 лет назад

    Полезный урок...и качественный

  • @hiphopik9185
    @hiphopik9185 3 года назад

    Лайк поставил. Ввожу node server всё норм ,но http-server - вот http-server' is not recognized as an internal or external command,
    operable program or batch file

    • @codedojo
      @codedojo  3 года назад

      http-server это отдельный модуль, который нужно предварительно установить. Решить проблему можно с помощью команды `npx http-server`. npx - это утилита, которая сама установит и запустит npm модуль.

  • @mistersandman6556
    @mistersandman6556 5 лет назад +5

    ничего не работает, всё делаю как у видео, но после запуска сервера и клиента ничего не происходит..

  • @kilirlink.....8012
    @kilirlink.....8012 5 лет назад

    делаем через cordova клиент и кайфуем

  • @Quassar18
    @Quassar18 4 года назад +24

    Плохой гайд. Автор упустил важные моменты: где взять глобальную команду http-server? Ответ: данный модуль можно установить глобально командой npm install --global http-server . Откуда берется веб страница и стиль для нее? Ответ: Автор просто решил скипнуть этот момент, страница и стили лежат в папке public на гитхабе по сссылке из видео. Если тупо следовать видео, то ничего не заработает. При этом при первом запуске http-server может возникнуть ошибка прав доступа к выполнению сценариев. Чтобы установить нужную политику введите Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser

    • @elkub
      @elkub 4 года назад +4

      святой человек, спасибо тебе!

    • @zhuvachkabubulgum7487
      @zhuvachkabubulgum7487 3 года назад +2

      +++ видео ни о чем 💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩💩

    • @sashashad
      @sashashad 2 года назад

      @@zhuvachkabubulgum7487 да ладно

    • @iMarkusUS
      @iMarkusUS Год назад

      Автор и вовсе закрыл свои гениальные исходники

  • @Антон-щ4г8ц
    @Антон-щ4г8ц 4 года назад

    Уважаемые, кто подскажет, как развернуть на реальном сервере? Не понимаю, как открыть порт на Nginx.

  • @shahzodtadjiyev4128
    @shahzodtadjiyev4128 2 года назад

    Спасибо за знание но server.js пустой
    же на гите

  • @kostobot
    @kostobot 6 лет назад +1

    Найс канал. Есть ли смысл писать чат на чистых вебсокетах или лучше использовать фреймворк, например Express?

    • @ccc3948
      @ccc3948 6 лет назад +2

      Я бы написал на чем-то вроде socket.io - быстрее и надежнее

    • @Graf777gos
      @Graf777gos 6 лет назад

      express + socket.io; koa + socket.io, в любом случае нужен еще http сервер; Лучше не использовать браузерные WebSockets, так как в них нет много нужно функционала, который реализован в socket.io (например)

  • @VladislavBarsukov-s2s
    @VladislavBarsukov-s2s 6 лет назад

    Ребят, вопрос довольно глупый, но хоть убей не понимаю, где он подключает html и css?

    • @ДаняБеренцев
      @ДаняБеренцев 6 лет назад +2

      Здесь показаны только js файлы, тоесть файлы скриптов. В частности он подключает app.js через тег в html файле, а не в скрипты подключает html, просто этого нет на видео)

    • @false_falcon
      @false_falcon 5 лет назад

      Обрати внимание на момент где автор выбирает getElementbyId...вот за этим и творится магия) он их не показал. Они просто в проекте лежат вместе с данным жсниками

  • @cyberblogru
    @cyberblogru 6 лет назад

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

    • @codedojo
      @codedojo  6 лет назад

      +Денис Каримов Это Consolas

  • @elliotraven4509
    @elliotraven4509 6 лет назад +1

    Автор канала, у тебя на сайте не работает функционал оформления подписки((((( плак плак

    • @codedojo
      @codedojo  6 лет назад

      Будьте добры пояснить в чём именно проблема.

    • @elliotraven4509
      @elliotraven4509 6 лет назад

      @@codedojo думал оформить подписку но при клике ничего не происходило. В консоль вроде что то вылетало, но сейчас не вспомню что...

    • @БорисАлефанов
      @БорисАлефанов 5 лет назад

      @@codedojo аналогичная ситуация с регистрацией через соц сеть

  • @temka_sd
    @temka_sd 5 лет назад

    Здравствуйте. А можно как-то запустить websocket server из браузера?

  • @nordeveloper
    @nordeveloper 5 лет назад

    Скачал с github файл сервер почему то пустой и там половина года нету

  • @turtrueweb
    @turtrueweb 4 года назад

    +

  • @sresetnjak
    @sresetnjak 5 лет назад +2

    На гитхабе server.js пуст.

    • @YukimuraChristian
      @YukimuraChristian 5 лет назад

      Там и app не написан вообще. Гитхаб ради галочки выложен был похоже.

    • @volodymyrlehenkyi7207
      @volodymyrlehenkyi7207 5 лет назад

      @@YukimuraChristian Написано ведь, исходники)

    • @SK-KS
      @SK-KS 2 года назад

      Добрый человек повыше в чате выложил исходники на свой Гит Хаб

  • @alexeysukhinin8036
    @alexeysukhinin8036 4 года назад

    А что... Коротко и только по теме.

  • @МишаАстахов-ю2д
    @МишаАстахов-ю2д 5 лет назад

    нихрена не работает

  • @Animalfox
    @Animalfox 5 лет назад +1

    Урок не полный.
    Имя "http-server" не распознано как имя командлета, функции, файла сценария или выполняемой программы.

    • @ILikeCherryJam
      @ILikeCherryJam 5 лет назад

      Команда в терминале "npm i http-server -g"

    • @ixtirochiavlodlar
      @ixtirochiavlodlar 4 года назад

      @@ILikeCherryJam ошибка npm Error

  • @vladvladov4095
    @vladvladov4095 3 года назад

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

  • @devope
    @devope 2 года назад

    Финальная версия проекта github.com/devope-learn/websocket-intro/tree/fixes

    • @sashashad
      @sashashad 2 года назад

      самая полезная ссылка!
      😀