웹소켓이란 무엇입니까? html5의 WebSocket에 대한 심층적인 이해

WebSocket이란 무엇입니까

WebSocket서버와 클라이언트는 양방향으로 통신할 수 있으며 도메인 간 통신을 허용합니다. HTTP/1.1의 Upgrade 메커니즘으로 지원, HTML5의 ws

WebSocket WebSocket(
  in DOMString url,
  in optional DOMString protocols
);

WebSocket WebSocket(
  in DOMString url,
  in optional DOMString[] protocols
);

wss

WebSocket

<을 통한 통신 (비암호화) 또는

(암호화) 프로토콜

🎜>HTML5클라이언트 <a href="http://www.php.cn/js/js-weixinapp-api.html" target="_blank">API<code><a href="http://www.php.cn/js/js-weixinapp-api.html" target="_blank">API</a>, 그리고 서버측에서는 각 언어가

// 创建一个Socket实例
var socket = new WebSocket('ws://localhost:8080');
// 打开Socket 
socket.onopen = function(event){
  // 发送一个初始化消息
  socket.send('I am the client and I\'m listening!');
  // 监听消息
  socket.onmessage = function(event){
    console.log('Client received a message',event);
  };
  // 监听Socket的关闭
  socket.onclose = function(event){
    console.log('Client notified socket has closed',event);
  };
  // 关闭Socket.... 
  //socket.close()
};

이벤트
onclose onerror onmessage onopen<🎜를 구현합니다. >

속성

• : readyState CONNECTING 0 OPEN 1 CLOSING 2CLOSED 3

• : binaryType String <a href="http://www.php.cn/wiki/58.html" target="_blank">배열<code>Blob 버퍼<a href="http://www.php.cn/wiki/58.html" target="_blank">Array</a>Buffer

호환성

방법 1:클라이언트가
을 지원하지 않는 경우 다음을 수행할 수 있습니다. 여러 후보 옵션 사용WebSocket Flash Socket AJAX long-polling AJAX multipart streaming <a href="http://www.php.cn/wiki/1488.html" target="_blank">JSON<code>IFrame P 폴링<a href="http://www.php.cn/wiki/1488.html" target="_blank">JSON</a>P polling

방법 2
를 사용하여 차이점을 완화합니다. 이 라이브러리는 브라우저가 Socket.io을 지원하지 않는 경우 자동으로 브라우저 지원을 사용할 수 있습니다. 또한 라이브러리는 연결이 끊어졌는지 여부를 감지하고 연결이 끊어지면 자동으로 다시 연결합니다. WebSocket

// 创建Socket.IO实例，建立连接
var socket= new io.Socket('localhost',{
  port: 8080,
});
socket.connect();
// 添加一个连接监听器
socket.on('connect',function(){
  console.log('Client has connected to the server!');
});
// 添加一个连接监听器
socket.on('message',function(data){
  console.log('Received a message from the server!',data);
});
// 添加一个关闭连接的监听器
socket.on('disconnect',function(){
  console.log('The client has disconnected!');
});
// 通过Socket发送一条消息到服务器
function sendMessageToServer(message){
  socket.send(message);
}

장점

• 실시간 양방향 소통

• 브라우저 네이티브 지원이 좋음(호환성은 다음과 같이 사용 가능) 타사 라이브러리) 솔루션)

• 맞춤 프로토콜 지원

실용 적용

• 채팅방

• 서버 메시지 푸시

• 프론트엔드, 백엔드 실시간 시스템

참고

• Websocket | MDN

• HTML5 WebSocket 알아보기

[관련 권장사항]

1.

무료 h5 온라인 동영상 튜토리얼

2.

HTML5 정식 버전 매뉴얼

3. 원본 HTML5 비디오 튜토리얼

위 내용은 웹소켓이란 무엇입니까? html5의 WebSocket에 대한 심층적인 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!