Web sockets
-
Upload
eugene-lisitsky -
Category
Technology
-
view
3.821 -
download
3
description
Transcript of Web sockets
![Page 1: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/1.jpg)
WebSockets
Докладчик: Лисицкий Евгений«Спорт Сегодня»
![Page 2: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/2.jpg)
Структура доклада:1.Работа интерактивного веба 2.Преимущества WebSockets.3. Сравнение со стандартными
технологиями.4.Техническая сторона вопроса5.Примеры реализации
![Page 3: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/3.jpg)
Схема работы:ТРАНСПОРТ
СЕРВЕР КЛИЕНТ
![Page 4: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/4.jpg)
Популярные реализации:• Erlang: MochWeb, Misultin • JavaScript: NodeJS• Perl: AnyEvent, Coro, POE • Python: Twisted, Tornado• Ruby: EventMachine и другие
![Page 5: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/5.jpg)
Схема работы:HTTP
ТРАНСПОРТ
СЕРВЕР
разные языки
КЛИЕНТ
JavaScript
![Page 6: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/6.jpg)
Интерактивность:• Минимальная латентность
• Асинхронность
![Page 7: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/7.jpg)
Ограничения НТТР при интерактивной работе:1. Синхронность
2. Жесткое распределение «клиент»-ведущий и «сервер»-ведомый
3. Низкая эффективность при передаче большого количества маленьких по объему данных
![Page 8: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/8.jpg)
Диаграмма работы НТТРКЛИЕНТ
СЕРВЕР
ВРЕМЯ
ведущий
ведомый
![Page 9: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/9.jpg)
КПД НТТРКПД НТТР Comet ~ 0,5…10 %
кпд паровоза= 7%
![Page 10: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/10.jpg)
Преимущества WebSockets
• Входит в HTML5, будет стандартом W3C• Двунаправленная передача данных (full-
duplex)• Асинхронность
![Page 11: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/11.jpg)
Передача данных:АСИНХРОННОСТЬ
FULL
-
DUPLEX
![Page 12: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/12.jpg)
Преимущества WebSockets
4. Низкие требования к сетевым ресурсам, максимальный КПД передачи данных,
минимум «накладных расходов»5. Время жизни канала в неактивном состоянии;6. Возможность работы с разными доменами;7. Неограниченное количество подключений к одному
домену.8. Очень простое API (интерфейс)
![Page 13: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/13.jpg)
JavaScript-объект:ws = new WebSocket("ws://site.com/demo");
ws.onopen = function() { alert("Connection opened...") }; ws.onclose = function() { alert("Connection closed...") }; ws.onmessage = function(evt) { alert(evt.data) };
ws.send(“Text…”);
![Page 14: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/14.jpg)
GET-запрос GET /demo HTTP/1.1Upgrade: WebSocketConnection: UpgradeHost: site.comOrigin: http://site.com
![Page 15: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/15.jpg)
Ответ сервераHTTP/1.1 101 Web Socket Protocol HandshakeUpgrade: WebSocketConnection: UpgradeWebSocket-Origin: http://site.comWebSocket-Location: ws://site.com/demo
![Page 16: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/16.jpg)
Text Data Frame
0x00, <строка в кодировке UTF-8>, 0xFF
![Page 17: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/17.jpg)
Binary Data Frame0x80, <длина - 1 или несколько байт>, <data>
GIF 1px, 43 байта : 0x80, 0x2B, <data>160 байт: 0x80, 0x81, 0x20, <data>
![Page 18: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/18.jpg)
Кодирование длины двоичных данных 0х81 0х20
0 + 128 + 32 = 160
1 0 0 0 0 0 0 1 0 0 1 0 0 0 0 0
0 0 0 0 0 0 0 0 1 0 1 0 0 0 0 0
![Page 19: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/19.jpg)
Пример:
http://chat.websockets.ruилиhttp://sn.im/ws-chat
![Page 20: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/20.jpg)
![Page 21: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/21.jpg)
Joe Armstrong:«Comet is dead long live websockets»
![Page 22: Web sockets](https://reader035.fdocuments.in/reader035/viewer/2022062514/5589530dd8b42af80b8b4689/html5/thumbnails/22.jpg)
Евгений Лисицкий
www.websockets.ru
twitter.com/lisitsky