美文网首页
webSockect的使用

webSockect的使用

作者: 指尖轻敲 | 来源:发表于2023-11-23 18:14 被阅读0次

Node端

首先要先下载ws模块npm i -S ws

const { WebSocketServer } = require('ws');
function initWS() {
    const wss = new WebSocketServer({
        port: 3111,
    });
    // 前端连接成功会进connection
    wss.on('connection', (ws) => {
        ws.on('error', () => {
            console.log('ws error');
        });
        // 收到前端发送的消息,会进message监听
        ws.on('message', (data) => {
            console.log(data.toString());
            ws.send('我是后端');
        });
    });
}
module.exports = {
    initWS
};

这样一个webSocket服务就创建成功了。前端通过ws://127.0.0.1:3111连接即可(这里是在本地,发布到线上要写先线上地址)。

前端部分

以Vue项目为例:

data: ()=>{
    return {
        ws: null
    }   
},
mounted() {
    // 连接web socket服务
    this.ws = new WebSocket('ws://127.0.0.1:3111');
    // 连接成功回调
    this.ws.onopen = () => {
        console.log('WebSocket connected');
    };
    // 接收到消息回调
    this.ws.onmessage = (data) => {
        console.log('接收到后端消息:', data);
    };
}

methods: {
    sendWsMessage(){
        this.ws.send('我是前端');
    }
}

websocket连接成功之后,调用send方法向socket服务发送消息,触发服务端的message监听后立即向前端回复了消息,前端在message中接收到后端的回复消息。

相关文章

  • web页面基于事件转发的webSocket同步技术分享

    本人在做websockect同步的项目积累了一些经验,整理出来即是方便自己日后查看,也可以分享给大家一起讨论学习,...

  • iconfont的使用(下载使用)

    1、下载文件 2、在生命周期中引入项目 beforeCreate () { var domModule = ...

  • Gson的使用--使用注解

    Gson为了简化序列化和反序列化的过程,提供了很多注解,这些注解大致分为三类,我们一一的介绍一下。 自定义字段的名...

  • 记录使用iframe的使用

    默认记录一下----可以说 这是我第一次使用iframe 之前都没有使用过; 使用方式: 自己开发就用了这几个属...

  • with的使用

    下面例子可以具体说明with如何工作: 运行代码,输出如下

  • this的使用

    什么是this? this是一个关键字,这个关键字总是返回一个对象;简单说,就是返回属性或方法“当前”所在的对象。...

  • this的使用

    JS中this调用有几种情况 一:纯粹的函数调用 这是函数的最通常用法,属于全局性调用,因此this就代表全局对象...

  • ==的使用

    积累日常遇到的编码规范,良好的编码习惯,持续更新。。。 日常使用==用于判断的时候,习惯性将比较值写前面,变量写后...

  • this的使用

    1.默认绑定,就是函数立即执行。 函数立即执行就是指向window,但是如果是node环境,就是指向全局conso...

  • %in% 的使用

    写在前面:From 生信技能书向量难点之一:%in% 难点 (1)== 与 %in% 的区别== 强调位置,x和对...

网友评论

      本文标题:webSockect的使用

      本文链接:https://www.haomeiwen.com/subject/cysgwdtx.html