jquery websocket 插件详解编程语言

//==========websocket 
(function($) { 
    $.websocket = function(options) { 
        var defaults = { 
            domain: top.location.hostname, 
            port:3398, 
            protocol:"" 
        }; 
        var opts = $.extend(defaults,options); 
        var szServer = "ws://" + opts.domain + ":" + opts.port + "/" + opts.protocol; 
        var socket = null; 
        var bOpen = false; 
        var t1 = 0;  
        var t2 = 0;  
        var messageevent = { 
            onInit:function(){ 
                if(!("WebSocket" in window) && !("MozWebSocket" in window)){   
                    return false; 
                } 
                if(("MozWebSocket" in window)){ 
                    socket = new MozWebSocket(szServer);   
                }else{ 
                    socket = new WebSocket(szServer); 
                } 
                if(opts.onInit){ 
                    opts.onInit(); 
                } 
            }, 
            onOpen:function(event){ 
                bOpen = true; 
                if(opts.onOpen){ 
                    opts.onOpen(event); 
                } 
            }, 
            onSend:function(msg){ 
                t1 = new Date().getTime();  
                if(opts.onSend){ 
                    opts.onSend(msg); 
                } 
                socket.send(msg); 
            }, 
            onMessage:function(msg){ 
                t2 = new Date().getTime();  
                if(opts.onMessage){ 
                    opts.onMessage(msg.data,t2 - t1); 
                } 
            }, 
            onError:function(event){ 
                if(opts.onError){ 
                    opts.onError(event); 
                } 
            }, 
            onClose:function(event){ 
                if(opts.onclose){ 
                    opts.onclose(event); 
                } 
                if(socket.close() != null){ 
                    socket = null; 
                } 
            } 
        } 
 
        messageevent.onInit(); 
        socket.onopen = messageevent.onOpen; 
        socket.onmessage = messageevent.onMessage; 
        socket.onerror = messageevent.onError; 
        socket.onclose = messageevent.onClose; 
         
        this.send = function(pData){ 
            if(bOpen == false){ 
                return false; 
            } 
            messageevent.onSend(pData); 
            return true; 
        } 
        this.close = function(){ 
            messageevent.onClose(); 
        } 
        return this; 
    }; 
})(jQuery);

我把自己网站后台管理部分重新写了一遍,以前用的ajax,因为采集部分我做的非常强大,而且是网页版的,python作为服务端,我需要能够实时与浏览器通信,这样才知道采集进度,之前用php curl 管道进行的批量采集,ajax返回进度,不是很实时,并且太死了,折腾了很久,于是我换成了websocket达到实时得知服务端详细信息

 

        这是我把websocket封装成了jquery插件,主要是为了更方便调用和让代码更加简洁,我后台管理是做成的一个web桌面形式,打开每个功能应用,主要是采集,必须使用websocket开启一个链接与python做的服务端进行通信,用原始的方式,会让结构非常不清晰,那就封装起来用吧,看下面例子

 

 

这是我这个websocket插件使用方法

//=========启动一个websocket 
    var Socket1 = $.websocket({ 
        domain:"www.qhnovel.com",   //这是与服务器的域名或IP 
        port:8080,                  //这是服务器端口号 
        protocol:"text",            //这东西可有可无,组合起来就是 ws://www.qhnovel.com:8080/test 
        onOpen:function(event){ 
            alert("已经与服务端握手,onOpen可省略不写"); 
        }, 
        onError:function(event){ 
            alert("发生了错误,onError可省略不写"); 
        }, 
        onSend:function(msg){ 
            alert("发送数据额外的代码,可省略不写"); 
        }, 
        onMessage:function(result,nTime){ 
            alert("从服务端收到的数据:" + result); 
            alert("最近一次发送数据到现在接收一共使用时间:" + nTime); 
        } 
    }); 
    //=========发送数据方式 
    Socket1.send("要发送的数据"); 
    //=========关闭连接 
    Socket1.close();

Socket.bOpen == false 时候没有连接到服务端

 

websocket客户端本身就比较简单,这里只是在大量使用时候结构更清晰,我在与python服务端进行通信时候数据是通过了base64编码,然后用json 方式发送过来的,js 解码 base64出现中文乱码可看我另一篇文章

 

python实现新版websocket服务端请看我另一篇文章

 

代码我给的都是完整的,也比较清晰,要用的人直接复制粘贴就可以了

 

来自:http://0x14.iteye.com

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/industrynews/13292.html

(0)
上一篇 2021年7月19日 15:38
下一篇 2021年7月19日 15:39

相关推荐

发表回复

登录后才能评论