在React + NodeJS上通过浏览器进行WebSockets

import React, { useEffect } from 'react';
import WebSocket from 'websocket';

const MyComponent = () => {
  useEffect(() => {
    const socket = new WebSocket('ws://localhost:8080'); // 替换为你的WebSocket服务器地址

    // 连接成功时的回调函数
    socket.onopen = () => {
      console.log('WebSocket连接成功');
    };

    // 接收到消息时的回调函数
    socket.onmessage = (event) => {
      console.log('收到消息:', event.data);
    };

    // 连接关闭时的回调函数
    socket.onclose = () => {
      console.log('WebSocket连接关闭');
    };

    // 发送消息
    socket.send('Hello, WebSocket!');

    // 在组件卸载时关闭WebSocket连接
    return () => {
      socket.close();
    };
  }, []);

  return <div>WebSocket示例</div>;
};

export default MyComponent;

const WebSocket = require('websocket').server;
const http = require('http');

const server = http.createServer((request, response) => {
  // 处理HTTP请求
});

server.listen(8080, () => {
  console.log('WebSocket服务器已启动');
});

const wsServer = new WebSocket({
  httpServer: server,
});

wsServer.on('request', (request) => {
  const connection = request.accept(null, request.origin);

  // 接收到消息时的回调函数
  connection.on('message', (message) => {
    console.log('收到消息:', message.utf8Data);
  });

  // 连接关闭时的回调函数
  connection.on('close', () => {
    console.log('WebSocket连接关闭');
  });

  // 发送消息
  connection.send('Hello, WebSocket!');
});