前端自己玩websocket

• node 服务端

// server.js
const WebSocket = require('ws');

// 创建 WebSocket 服务器实例
const wss = new WebSocket.Server({ port: 8081 });

// 当有客户端连接时触发
wss.on('connection', (ws) => {
  console.log('New client connected!');

  // 接收客户端发送的消息
  ws.on('message', (msg) => {
    console.log(`Received msg => ${msg}`);
    
    // 可以在这里处理收到的消息并决定如何响应

    // 向客户端发送消息
    ws.send(`websocket回复你->：返回${msg}的消息`);
  });

  // 客户端关闭连接时触发
  ws.on('close', () => {
    console.log('Client disconnected');
  });
});

console.log('WebSocket server is listening on port 8081');

• 客户端

<template>
  <div>
    <input type="text" v-model="msg" /><button @click="sendMessage">
      发送
    </button>
  </div>
</template>

<script>
export default {
  name: "websocket",
  data() {
    return {
      ws: null,
      msg: "",
    };
  },
  created() {
    this.ws = new WebSocket("ws://localhost:8081");
    this.ws.onopen = () => {
      console.log("open");
    };
    this.ws.onerror = (err) => {
      console.log(err);
    };
    this.ws.onmessage = (msg) => {
      console.log(msg.data);
    };
  },
  mounted() {},
  methods: {
    sendMessage() {
      if (this.ws.readyState === 1) {
        this.ws.send(this.msg);
      }
    },
  },
  beforeDestroy() {
    if (this.ws) this.ws.close();
  },
};
</script>

<style lang="scss" scoped></style>