WebSocket을 사용하여 데이터를 보내고 받는 방법

WebSocket은 서버와 클라이언트가 항상 연결된 상태를 유지하여 양방향 통신을 가능하게 하는 기술이므로 WebSocket에서 데이터를 주고받을 수 있습니다. 이번 글에서는 WebSocket을 사용하여 데이터를 주고받는 방법을 살펴보겠습니다. .

먼저 살펴보겠습니다문자 데이터를 보내는 방법은 무엇인가요?

무료로 제공되는 echo.websocket.org를 샘플로 사용

구체적인 예는 다음과 같습니다

var connection = new WebSocket('wss://echo.websocket.org');
 
connection.send('样本数据');

이 예에서는 WebSocket 인스턴스가 생성되고 send() 메서드를 사용하여 데이터가 전송되는 것을 확인합니다. .

그러나 일반적으로 데이터는 언제든지 전송되어야 합니다.

그래서 버튼을 눌러 폼에 입력한 데이터를 전송하고 싶다면 아래와 같이 작성하시면 됩니다.

btn.addEventListener('click', function(e) {
  var text = document.getElementById('text');
 
  connection.send(text.value);
})

이 예에서는 양식에 입력된 문자열을 가져와 send()의 인수에 적용합니다.

이 방법으로 모든 텍스트 데이터를 보낼 수 있습니다.

문자 데이터는 어떻게 받나요?

이번에 사용한 테스트 서버 Echo.websocket.org는 전송된 데이터를 그대로 반환합니다.

코드는 다음과 같습니다

connection.onmessage = function(e) {
    console.log(e.data);
};

4가지 유형의 이벤트 처리에서 메시지를 수신하는 onmessage() 이벤트를 사용합니다.

간단한 설명이지만, 이것만으로도 서버에서 반환된 데이터를 받게 됩니다.

근데, close() 메소드를 함께 사용하면 인코딩은 다음과 같습니다

connection.onmessage = function(e) {
    console.log(e.data);
    connection.close();
};

이 경우 데이터를 받은 직후에 통신이 끊어집니다.

이때, close()가 통신을 끊게 되면 WebSocket과 다시 연결을 하지 않는 이상 통신이 불가능하다는 점 주의하세요!

위 내용은 WebSocket을 사용하여 데이터를 보내고 받는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!