실시간 데이터 푸시에서의 WebSocket 적용 실습-PHP 튜토리얼-php.cn

실시간 데이터 푸시에서의 WebSocket 적용 실습

WBOY

풀어 주다： 2023-10-15 14:34:02

원래의

1438명이 탐색했습니다.

실시간 데이터 푸시에서의 WebSocket 적용 실습

제목: 실시간 데이터 푸시에서 WebSocket의 응용 실습

소개:
인터넷 기술의 급속한 발전으로 인해 실시간 데이터 푸시는 많은 응용 분야에서 중요한 요구 사항이 되었습니다. 그러나 기존 HTTP 프로토콜은 요청-응답 방법 제한으로 인해 실시간 데이터 푸시 요구 사항을 충족할 수 없습니다. 전이중 통신 프로토콜인 WebSocket은 간단한 핸드셰이크를 통해 클라이언트와 서버 간에 지속적인 연결을 설정하여 실시간 양방향 통신을 달성할 수 있습니다. 이 기사에서는 실시간 데이터 푸시에서 WebSocket의 애플리케이션 사례를 소개하고 구체적인 코드 예제를 제공합니다.

1. WebSocket 소개
WebSocket은 HTTP 프로토콜과 마찬가지로 애플리케이션 계층 프로토콜이지만, 대신 HTTP의 일회성 요청-응답 모드를 설정합니다. 클라이언트가 사용할 수 있는 지속적인 연결입니다. 클라이언트와 서버 간의 실시간 양방향 통신입니다. 그 목적은 HTTP 프로토콜의 실시간 데이터 푸시 문제를 해결하는 것입니다.

2. WebSocket 응용 시나리오

실시간 채팅 시스템: WebSocket은 실시간 채팅 기능을 실현할 수 있으며 사용자는 즉시 메시지를 보내고 받을 수 있습니다.
실시간 모니터링 시스템: WebSocket은 모니터링 데이터의 실시간 푸시를 실현하여 모니터링 시스템의 데이터를 더욱 실시간이고 정확하게 만들 수 있습니다.
실시간 주식 거래 시스템: WebSocket을 사용하여 주식 시장 데이터를 실시간으로 푸시할 수 있으며, 투자자는 주식 변동을 실시간으로 이해할 수 있습니다.
게임 실시간 통신: WebSocket은 실시간 전투, 채팅 및 기타 기능과 같은 게임 내 실시간 메시징에 사용될 수 있습니다.

3. WebSocket 애플리케이션 실습
아래에서는 실시간 데이터 푸시에 WebSocket을 사용하는 방법을 보여주는 예를 사용합니다.

서버측 구현:
먼저 WebSocket 서버를 생성해야 합니다. Node.js 환경에서는 ws 모듈을 사용하여 WebSocket 서버를 생성할 수 있습니다. 구체적인 코드는 다음과 같습니다.

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
  // 建立连接时触发的回调函数
  console.log('Client connected');

  // 模拟实时推送数据
  setInterval(() => {
    ws.send(new Date().toString());
  }, 1000);

  ws.on('close', () => {
    // 关闭连接时触发的回调函数
    console.log('Client disconnected');
  });
});

로그인 후 복사

코드 설명:

WebSocket 서버를 생성하고 포트 8080을 수신합니다.
클라이언트가 서버와 연결을 설정하면 connection 이벤트가 트리거되고 해당 콜백 함수가 실행됩니다. connection事件，执行相应的回调函数。
在回调函数中，可以通过ws对象与客户端进行通信。
在本例中，我们模拟每秒向客户端推送当前时间。

客户端实现：
客户端使用浏览器内置的WebSocket对象来连接WebSocket服务器，并与服务器进行实时通信。具体代码如下：

const ws = new WebSocket('ws://localhost:8080');

ws.onopen = () => {
  // 连接建立时触发的回调函数
  console.log('Connected to WebSocket server');
};

ws.onmessage = (message) => {
  // 收到服务器推送的消息时触发的回调函数
  console.log('Received message: ' + message.data);
};

ws.onclose = () => {
  // 连接关闭时触发的回调函数
  console.log('Disconnected from WebSocket server');
};

로그인 후 복사

代码说明：