WebSocket

WebSocket和http一样是一种协议 被设计出来用于在客户端和服务器之间提供 低延迟、全双工、长期运行 的连接

全双工：通信的参与方可以同时发送和接收数据，不需要等待对方的响应或传输完成

代码示例： 服务器端

const http = require('http');
const WebSocket = require('ws');

const server = http.createServer();
const wss = new WebSocket.Server({server});

wss.on('connection',socket => {
    console.log('WebSocket连接已打开');

    socket.on('message',message => {
        console.log('收到消息：'+message);
        socket.send('Hello FireUG');
    });

    socket.on('close',() => {
        console.log('WebSocket连接已经关闭');
    });
});

server.on('request',(request,response) => {
    response.writeHead(200,{'Content-Type':'text/plain'});
    response.end('Hello,World!'); 
});

server.listen(8080,() => {
    console.log('服务器启动，端口号8080'); 
})

客户端

<template>
  <div>
    {{ msg }}
    <br />
    <button @click="sendMsg">发起请求</button>
  </div>
</template>
<script setup lang="ts">
import { ref } from 'vue';

const msg = ref('');

const socket = new WebSocket('ws://localhost:8080');
socket.onopen = function(event){
  console.log('WebSocket连接已经打开');
};

socket.onmessage = function(event){
  console.log('收到回复：'+event.data);
}

socket.onclose = function(event){
  console.log('WebSocket连接已关闭');
};
const sendMsg = () => {
  socket.send('Hello World!');
}
</script>
<style scoped>

</style>