ws 实时通讯

原创于 2023-02-28 18:41:51 发布 · 120 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #react.js

本文演示了如何通过npm安装ws库，并在React组件中建立WebSocket连接到localhost:8181。当连接打开时，它会发送数据，并设置onmessage事件处理器来接收和打印接收到的数据，同时处理连接关闭的情况。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1:安装插件npm i ws -S

2:直接用就好啦,send是向后台传输数据

import React from "react";
export default function Ws(props) {
    let ws = new WebSocket("ws://localhost:8181")
    ws.onopen = function () {
        console.log('已连接');
        ws.send("发送数据")
    }

    ws.onmessage = function (evt) {
        let received_msg = evt.data
        console.log('received_msg', received_msg);
    }

    ws.onclose = function () {
        console.log('连接已关闭...');
    }
    return (
        <div>

        </div>
    )
}