알 수 없는 웹소켓

4919 단어
WebSocket는 일종의 네트워크 통신 프로토콜이다.

WebSocket이 필요한 이유

HTTP 프로토콜에 결함이 하나 있기 때문이다. 통신은 클라이언트만 시작할 수 있다.이런 단방향 요청의 특징은 만약에 서버가 연속적인 상태 변화가 있으면 클라이언트가 알게 되면 매우 번거롭다는 것이다.우리는 단지 "윤문"을 사용할 수 있을 뿐이다. 매 단계마다 서버에 새로운 정보가 있는지 문의를 보낼 수 있다.
폴링 기술은 (짧은) 폴링(Polling, Comet의 긴 폴링(Long-polling과 흐름 기술(Http Streaming 등이 있다.
윤문의 효율이 낮아서 자원을 매우 낭비한다.그래서 websocket 응용으로 태어났다.
W3C는 HTML5 에서 clientserver 간 전이중 통신을 하는 네트워크 기술WebSocket을 제공했다.WebSocket는 새로운, 독립적인 협의로 TCP 협의를 바탕으로 HTTP 협의와 호환되지만 HTTP 협의에 융합되지 않고 HTML5의 일부분으로만 한다.

WebSocket 원리

WebSocket는 일종의 프로토콜로 HTTP와 동등한 네트워크 프로토콜로 둘 다 응용층 프로토콜로 TCP 프로토콜을 바탕으로 한다.그러나WebSocket는 양방향 통신 프로토콜로 연결을 구축한 후WebSocketserverclient는 상대방에게 자발적으로 데이터를 보내거나 수신할 수 있다.또한 WebSocket 연결을 구축할 때 HTTP 협의를 빌려야 한다. 연결이 구축된 후clientserver 간의 양방향 통신은 HTTP와 무관하다.
전통적HTTP의 매번'청구-응답'에 비해 client server 연결을 구축하는 모델WebSocket은 긴 연결의 모델이다.WebSocket 연결이 구축되면 client 또는 server 중 한 쪽이 주동적으로 연결을 끊지 않으면 매번 데이터가 전송되기 전에 HTTP 그렇게 데이터를 요청할 필요가 없다.
다음은 메시지 차원에서 WebSocketHTTP의 차이에 대해 이야기한다.
먼저 client 연결을 시작하고 메시지는 WebSocket와 유사하지만 주로 몇 가지 다른 점이 있습니다.
  • HTTP: Upgrade: websocket 유형의 요청임을 나타낸다. WebSocket 통신 프로토콜을 server로 전환해야 한다는 뜻이다.
  • WebSocket: Sec-WebSocket-Key이 보낸 client 인코딩 밀문입니다. base64 암호화에 대응하는 server 응답을 되돌려야 합니다. 그렇지 않으면 Sec-WebSocket-Accept 오류가 발생하고 연결을 닫습니다.
  • client 메시지를 받은 후 Error during WebSocket handshake 프로토콜을 지원하면 자신의 통신 프로토콜을 server 로 전환하고 다음 정보를 되돌려줍니다.
  • WebSocket: 반환된 상태 코드는 WebSocket, 동의HTTP/1.1 101 WebSocket Protocol Handshake의 프로토콜 전환 요청입니다.
  • 101
  • client
  • Upgrade: websocket ...

  • 이상은 모두 Connection: Upgrade 협의를 이용하여 완성한 것이다.이로써'청구-상응'과정을 거쳐 Sec-WebSocket-Accept:HTTP연결악수에 성공하면 후속적으로 server통신을 할 수 있고 client아무 일도 없다.

    WebSocket 통신 기능

  • 의 가장 큰 특징은 서버가 클라이언트에게 주동적으로 정보를 전송할 수 있고 클라이언트도 주동적으로 서버에 정보를 전송할 수 있다는 것이다. 이것은 진정한 쌍방향 평등 대화로 서버 전송 기술의 하나에 속한다.
  • WebSocket 프로토콜을 바탕으로 서버 측의 실현이 비교적 쉽다.
  • TCP 협의는 좋은 호환성을 가지고 있다.기본 포트도 HTTPTCP 이며 악수 단계에서 HTTP 프로토콜을 사용하기 때문에 악수할 때 차단하기 어렵고 각종 80 프록시 서버를 통과할 수 있습니다.
  • 데이터 형식이 비교적 가볍고 성능 비용이 적으며 통신이 효율적이다.
  • 텍스트를 보낼 수도 있고 바이너리 데이터를 보낼 수도 있다.
  • 소스 제한이 없으며 클라이언트는 임의의 서버와 통신할 수 있습니다.
  • 프로토콜 식별자는 (암호화된 경우 443, 서버 주소는 HTTP 입니다.

  • WebSocket 인스턴스


    클라이언트 인스턴스
    var ws = new WebSocket("(wss://echo.websocket.org/)");
    
    ws.onopen = function(evt) {
      console.log("Connection open ..."); 
      ws.send("Hello WebSockets!");
    };
     
    ws.onmessage = function(evt) { 
      console.log( "Received Message: " + evt.data); 
      ws.close();
    };
    
    ws.onclose = function(evt) { 
      console.log("Connection closed.");
    }; 
    

    클라이언트 API
  • HTTP 대상은 구조 함수로 새로 만들기ws 실례에 사용됩니다.
  •  var ws = new WebSocket('ws://localhost:8000');
    

    위 문장을 실행하면 클라이언트가 서버와 연결됩니다.
  • wss 인스턴스 객체의 현재 상태를 반환합니다. 값은 URL: 값은 WebSocket 연결 중임을 나타냅니다.WebSocket: 값은 webSocket.readyState 연결 성공, 통신 가능.CONNECTING: 값은 0로 연결이 닫히고 있음을 나타냅니다.OPEN: 값은 1로 연결이 꺼졌거나 연결을 열 수 없음을 나타냅니다.
  • CLOSING는 연결이 성공한 후의 리셋 함수를 지정하는 데 사용되거나2 방법을 사용할 수 있습니다.
  • CLOSED는 연결이 닫힌 후의 리셋 함수를 지정하는 데 사용됩니다.
  • 3는 서버 데이터를 받은 후 리셋 함수를 지정하거나 webSocket.onopen 방법을 사용할 수 있습니다.
  • addEventListener는 서버에 데이터를 전송하는 데 사용됩니다.
  • webSocket.onclose는 바이트의 바이트 데이터가 얼마나 더 발송되지 않았는지 나타낸다.그것은 발송이 끝났는지 아닌지를 판단하는 데 쓸 수 있다.
  • webSocket.onmessage는 오류를 보고할 때의 리셋 함수를 지정하는 데 사용되거나addEventListener 방법을 사용할 수 있다.

  • WebSocket 서버의 구현은 webSocket.send() 의 µWebSockets, Socket에서 사용할 수 있습니다.IO,WebSocket-Node
    전체 데모 주소
    참고 자료: WebSocket 및 Socket.IO WebSocket 자습서 HTML5 WebSocket 자습서

    좋은 웹페이지 즐겨찾기