WebScoket实现告警/工单推送

最新推荐文章于 2024-02-25 23:24:09 发布

原创最新推荐文章于 2024-02-25 23:24:09 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#websocket #nodejs

本文介绍如何使用WebSocket实现告警和工单的实时推送，通过减少客户端请求优化性能。涵盖服务端搭建、接口编写及客户端调用流程。

WebScoket实现告警/工单推送

为什么要使用websocket进行推送？

这一点菜鸟教程讲的很清楚，归根究底还是为了减少客户端的请求，优化浏览器性能。

一个完整的WebSocket推送需要三样东西

服务端：websocket服务（与客户端建立长连接）
服务端：写接口（当触发告警或工单时供客户端调用）
客户端：调接口（将消息推送给客户端）

1. 创建websocket服务

我用的是webstorm创建了一个node+express的服务，然后下载ws依赖。websocket服务监听的是8901端口。

npm install ws

const WebSocket = require('ws'); // 引入模块
const ws = new WebSocket.Server({port:8901},()=>{ // 监听接口
  console.log("socket start")
})

在这里插入图片描述

2.写接口

以工单为例。客户端在调用/wo这个接口时，服务器端会向其他客户端发送消息

var jsonBodyParser = bodyParser.json({type: 'application/json'});

router.post('/wo', jsonBodyParser, function(req, res){ //router相当于express.router
    var body = req.body;
    _.each(body.wos, function(o){
        woService.sendWo(body.tenantEname, o.userIds, o.wo);
    });
    res.end();
});

3.客户端调接口

调用之前写的/wo接口，向服务端传递消息

$.ajax({
           url: ToolBox.woWs,
            dataType: 'json',
            type: 'post',
            contentType: 'application/json',
            data: JSON.stringify({
                wos: [{
                    userIds: userIds,
                    wo: {title: workOrder.title}
                }],
                tenantEname: app.userInfo.toJSON().tenant_ename
            }),
            success: function () {

            }
        })

在客户端监听服务端传递过来的消息

this.ws = new WebSocket(this.wourl + '?' + $.param({ticket: ticket}));
        this.ws.onopen = function(){
            console.log('Wss[/wo] Connection to server opened');
        };
        this.ws.onmessage = function(e){
            console.log(e.data);
            //定制化展示
        };