HTML5 - WebSockets

WebSockets, tek bir soket üzerinden çalışan ve HTML 5 uyumlu tarayıcılarda bir JavaScript arayüzü aracılığıyla sunulan web uygulamaları için yeni nesil çift yönlü bir iletişim teknolojisidir.

Web sunucusuyla bir Web Soketi bağlantısı kurduğunuzda, tarayıcıdan sunucuya bir arama yaparak veri gönderebilirsiniz. send() yöntemi ve sunucudan tarayıcıya veri alma onmessage olay işleyicisi.

Aşağıda, yeni bir WebSocket nesnesi oluşturan API yer almaktadır.

var Socket = new WebSocket(url, [protocal] );

Burada ilk bağımsız değişken olan url, bağlanılacak URL'yi belirtir. İkinci öznitelik olan protokol isteğe bağlıdır ve varsa, bağlantının başarılı olması için sunucunun desteklemesi gereken bir alt protokolü belirtir.

WebSocket Nitelikleri

Aşağıda WebSocket nesnesinin özniteliği verilmiştir. Yukarıda belirtildiği gibi Socket nesnesini oluşturduğumuzu varsayarsak -

Sr.No.	Öznitelik ve Açıklama
1	Socket.readyState Salt okunur özelliği readyState, bağlantının durumunu temsil eder. Aşağıdaki değerlere sahip olabilir - 0 değeri, bağlantının henüz kurulmadığını gösterir. 1 değeri, bağlantının kurulduğunu ve iletişimin mümkün olduğunu gösterir. 2 değeri, bağlantının kapanış anlaşmasından geçtiğini gösterir. 3 değeri, bağlantının kapatıldığını veya açılamadığını gösterir.
2	Socket.bufferedAmount Salt okunur özelliği bufferedAmount, send () yöntemi kullanılarak sıraya alınan UTF-8 metninin bayt sayısını temsil eder.

WebSocket Olayları

Aşağıda WebSocket nesnesiyle ilişkili olaylar yer almaktadır. Yukarıda belirtildiği gibi Socket nesnesini oluşturduğumuzu varsayarsak -

Etkinlik	Olay işleyicisi	Açıklama
açık	Socket.onopen	Bu olay, soket bağlantısı kurulduğunda meydana gelir.
İleti	Socket.onmessage	Bu olay, istemci sunucudan veri aldığında gerçekleşir.
hata	Socket.onerror	Bu olay, iletişimde herhangi bir hata olduğunda meydana gelir.
kapat	Socket.onclose	Bu olay, bağlantı kapatıldığında meydana gelir.

WebSocket Yöntemleri

Aşağıda WebSocket nesnesiyle ilişkili yöntemler verilmiştir. Yukarıda belirtildiği gibi Socket nesnesini oluşturduğumuzu varsayarsak -

Sr.No.	Yöntem ve Açıklama
1	Socket.send() Send (veri) yöntemi, bağlantıyı kullanarak verileri iletir.
2	Socket.close() Close () yöntemi mevcut herhangi bir bağlantıyı sonlandırmak için kullanılacaktır.

WebSocket Örneği

WebSocket, istemci ile sunucu arasında standart bir çift yönlü TCP soketidir. Soket bir HTTP bağlantısı olarak başlar ve ardından bir HTTP el sıkışmasından sonra bir TCP soketine "Yükseltilir". El sıkışmadan sonra her iki taraf da veri gönderebilir.

İstemci Tarafı HTML ve JavaScript Kodu

Bu öğreticiyi yazarken, WebSocket () arayüzünü destekleyen yalnızca birkaç web tarayıcısı vardır. Aşağıdaki örneği Chrome, Mozilla, Opera ve Safari'nin en son sürümüyle deneyebilirsiniz.

<!DOCTYPE HTML>

<html>
   <head>
      
      <script type = "text/javascript">
         function WebSocketTest() {
            
            if ("WebSocket" in window) {
               alert("WebSocket is supported by your Browser!");
               
               // Let us open a web socket
               var ws = new WebSocket("ws://localhost:9998/echo");
				
               ws.onopen = function() {
                  
                  // Web Socket is connected, send data using send()
                  ws.send("Message to send");
                  alert("Message is sent...");
               };
				
               ws.onmessage = function (evt) { 
                  var received_msg = evt.data;
                  alert("Message is received...");
               };
				
               ws.onclose = function() { 
                  
                  // websocket is closed.
                  alert("Connection is closed..."); 
               };
            } else {
              
               // The browser doesn't support WebSocket
               alert("WebSocket NOT supported by your Browser!");
            }
         }
      </script>
		
   </head>
   
   <body>
      <div id = "sse">
         <a href = "javascript:WebSocketTest()">Run WebSocket</a>
      </div>
      
   </body>
</html>

Pywebsocket yükleyin

Yukarıdaki istemci programını test etmeden önce, WebSocket'i destekleyen bir sunucuya ihtiyacınız var. İndirin mod_pywebsocket-xxxtar.gz pywebsocket Apache HTTP Sunucusu için bir Web Soket uzantısı sağlamak ve aşağıdaki adımları izleyerek yüklemek hedefliyor.

İndirilen dosyanın sıkıştırmasını açın ve açın.
İçeri gir pywebsocket-x.x.x/src/ dizin.
$ python setup.py build
$ sudo python setup.py install
Ardından belgeyi şu şekilde okuyun -
- $ pydoc mod_pywebsocket

Bu, onu python ortamınıza kuracaktır.

Sunucuyu başlatın

Şuraya git pywebsocket-x.x.x/src/mod_pywebsocket klasör ve aşağıdaki komutu çalıştırın -

$sudo python standalone.py -p 9998 -w ../example/

Bu, sunucuyu 9998 numaralı bağlantı noktasında dinlemeye başlayacak ve handlers echo_wsh.py dosyamızın bulunduğu -w seçeneği ile belirtilen dizin.

Şimdi Chrome tarayıcısını kullanarak, başlangıçta oluşturduğunuz html dosyasını açın. Tarayıcınız WebSocket () 'i destekliyorsa, tarayıcınızın WebSocket'i desteklediğini belirten bir uyarı alırsınız ve son olarak "WebSocket'i Çalıştır" seçeneğini tıkladığınızda sunucu betiği tarafından gönderilen Hoşçakal mesajını alırsınız.