WebSocket: шта је то, протокол пунодуплексне комуникације и како ради

Шта је WebSocket?

WebSocket — је комуникациони протокол који ради преко TCP-а и обезбеђује пунодуплексни канал између клијента и сервера. Стандардизован је од стране IETF-а као RFC 6455 2011. године и подржан од свих савремених прегледача, мобилних платформи и серверских оквира.

За разлику од HTTP-а, где клијент покреће захтев и добија одговор, WebSocket омогућава обема странама да шаљу поруке у било ком тренутку након успостављања везе. То га чини идеалним за сценарије који захтевају тренутну испоруку података: четови, обавештења, заједничко уређивање докумената.

Протокол WebSocket користи HTTP порт 80 или HTTPS порт 443 за почетно руковање, након чега прелази на сопствени протокол са минималним заглављем — само 2 бајта уместо 800+ бајтова у HTTP-у. Ова карактеристика даје значајну предност у перформансама при великом броју порука.

Кључне карактеристике протокола

WebSocket веза почиње HTTP захтевом за надоградњу (Upgrade), након чега протокол прелази на бинарни формат оквира. Величина оквира варира од 2 бајта до 2^63 бајта, што омогућава пренос и кратких текстуалних порука и великих бинарних података. Подржана је фрагментација порука, маскирање података од клијента ка серверу и ping/pong за одржавање везе.

Како ради WebSocket?

Процес успостављања WebSocket везе састоји се из две фазе: руковање и пренос података. У фази руковања, клијент шаље HTTP захтев са заглављем Upgrade: websocket, а сервер потврђује прелазак протокола статусом 101 Switching Protocols. Након тога, веза прелази у режим пунодуплексног преноса.

Свака порука у WebSocket-у се дели на оквире. Оквир садржи opcode (текст, бинарни подаци, затварање, ping/pong), дужину података и кључ за маскирање података од клијента. Оквир може бити фрагментован — контролни оквири (ping/pong) могу се преносити између фрагмената поруке, што спречава прекид везе при дугом преносу.

const ws = new WebSocket('wss://example.com/chat')

ws.addEventListener('open', () => {
    console.log('Веза успостављена')
    ws.send('Здраво, сервере!')
})

ws.addEventListener('message', (event) => {
    console.log('Примљено:', event.data)
})

ws.addEventListener('close', () => {
    console.log('Веза затворена')
})

У наведеном примеру, клијент креира објекат WebSocket, наводећи заштићени URL wss://. Након отварања везе, шаље се поздравна порука, а руковалац message прима одговоре од сервера. При затварању, активира се руковалац close — ово је важно за поновно повезивање при прекиду мреже.

WebSocket vs HTTP: поређење

Главна разлика између WebSocket-а и HTTP-а је у моделу интеракције. HTTP ради по шеми захтев-одговор: клијент покреће захтев, сервер враћа одговор, веза се затвара. WebSocket, међутим, успоставља стални канал кроз који обе стране могу покренути пренос у било ком тренутку.

За апликације које захтевају ниско кашњење и сталан ток података, WebSocket је значајно ефикаснији. HTTP Long Polling — алтернатива у којој сервер држи захтев отвореним док се не појаве подаци — ствара додатно оптерећење сервера и повећава потрошњу меморије због више истовремених веза.

Према High Performance Browser Networking (Grigorik, O’Reilly), WebSocket смањује мрежна кашњења у сценаријима у реалном времену за 40–60% у поређењу са HTTP Long Polling-ом, а оптерећење сервера се смањује 3–5 пута захваљујући елиминацији поновног руковања.

Где се примењује WebSocket

Захваљујући ниској латентности и двосмерној комуникацији, WebSocket се користи у широком спектру апликација. Кључни сценарији укључују тренутну размену порука, синхронизацију стања у играма и пренос тржишних података у финансијским системима.

Четови и месинџери

WebSocket је постао дефакто стандард за чет апликације. Платформе попут Slack-а, Telegram Web-а и WhatsApp Web-а користе WebSocket за тренутну испоруку порука. Протокол омогућава слање и текстуалних порука и датотека кроз јединствени канал, а механизам ping/pong одржава везу активном чак и при недостатку активности.

Онлајн игре

Вишекорисничке прегледачке и мобилне игре захтевају минимално кашњење за синхронизацију стања играча. WebSocket преноси координате, акције и догађаје у реалном времену без кашњења HTTP захтева. Оквири попут Socket.IO и Colyseus-а апстрахују нискоризиони рад са протоколом, додајући аутоматско поновно повезивање и собе.

Финансијске апликације

Берзански терминали и трговачке платформе користе WebSocket за пријем котација у реалном времену. Кашњење од неколико милисекунди може коштати милионе долара, због чега финансијски API-ји — на пример, Binance WebSocket Streams, Coinbase Pro — пружају управо WebSocket интерфејсе за тржишне податке.

Мобилне апликације и IoT

У мобилном развоју, WebSocket се користи кроз изворне API-је: URLSessionWebSocketTask на iOS-у и OkHttp WebSocket на Android-у. За Flutter постоји библиотека web_socket_channel, а за React Native — react-native-websocket. IoT уређаји примењују WebSocket за пренос телеметрије и пријем командних упутстава, јер протокол троши мање енергије од сталног HTTP-polling-а.

Примери кода WebSocket

Размотримо пример серверског дела у Node.js са библиотеком ws — најпопуларнијом имплементацијом WebSocket-а за JavaScript. Сервер прихвата повезивања, обрађује поруке и емитује их свим повезаним клијентима.

const WebSocket = require('ws')
const wss = new WebSocket.Server({ port: 8080 })

wss.on('connection', (ws) => {
    console.log('Нови клијент повезан')

    ws.on('message', (data) => {
        console.log('Примљено:', data.toString())
        ws.send('Сервер је примио вашу поруку')
    })

    ws.on('close', () => {
        console.log('Клијент искључен')
    })
})

console.log('WebSocket сервер покренут на порту 8080')

Сервер креира инстанцу WebSocket.Server на порту 8080 и чека повезивања. Сваком новом клијенту додељује се посебан ws објекат, преко којег сервер може слати поруке појединачно. Емитовање порука свим клијентима реализује се масовним проласком кроз низ веза. При великом броју клијената (више од 1000) препоручује се коришћење библиотека са подршком за кластеризацију, попут Socket.IO, које додају скалирање преко Redis-а и аутоматско поновно повезивање.

Слање порука свим клијентима

wss.clients.forEach((client) => {
    if (client.readyState === WebSocket.OPEN) {
        client.send('Порука за све учеснике')
    }
})

Провера readyState пре слања је обавезна: ако се клијент већ искључио, позив send ће избацити грешку. Заставица WebSocket.OPEN гарантује да је веза активна и да ће порука бити достављена.

За мобилне iOS апликације, WebSocket се имплементира кроз URLSessionWebSocketTask, доступан од iOS 13. Сесија креира задатак са URL-ом протокола wss://, након чега се позивају методе send и receive. Пријем порука може се организовати кроз непрекидну рекурзију receive, која чека следећу поруку након обраде претходне, обезбеђујући стални пријем података без поновног повезивања. За Android се користи OkHttp WebSocket, који пружа сличан интерфејс са повратним позивима onOpen, onMessage, onClosing и onClosed, као и аутоматско поновно повезивање при прекиду везе.

При раду са WebSocket-ом у мобилним апликацијама, важно је узети у обзир управљање животним циклусом: када апликација пређе у позадину, веза може бити прекинута од стране система. На iOS-у је потребно поново успоставити везу при повратку у предњи план преко делегата sceneDidBecomeActive. На Android-у треба користити Lifecycle-aware компоненте или Service за одржавање везе. Додатно, препоручује се имплементација exponential backoff-а при поновном повезивању — повећавање интервала између покушаја са 1 на 30 секунди, како се не би стварало прекомерно оптерећење сервера при привременим мрежним проблемима.