分享个websocket插件带断线重连

分享 未结
16 2335
用个名字真难
悬赏:20飞吻
layui.define(["jquery"],function(a){"use strict";var c,b=layui.jquery,d=function(){},e=function(){try{var a=new WebSocket(d.config.wsUrl);return a.onmessage=function(a){d.config.onmessage(a),g.reset()},a.onclose=function(){d.config.onclose(),f()},a.onerror=function(){d.config.onerror(),f()},a.onopen=function(){d.config.onopen(),g.start()},a}catch(b){f()}},f=function(){return d.config.lockReconnect?void 0:(d.config.lockReconnect=!0,1==d.config.ShInt?!1:(setTimeout(function(){d.config.isqidong=!1,console.log("服务器重新连接中...."),layui.socket.init(d.config),d.config.lockReconnect=!1},2e3),void 0))},g={timeout:d.config.timeout,timeoutObj:null,serverTimeoutObj:null,reset:function(){d.config.isqidong=!0,console.log("心跳"),clearTimeout(this.timeoutObj),clearTimeout(this.serverTimeoutObj),g.start()},start:function(){var a=this;this.timeoutObj=setTimeout(function(){d.config.isqidong=!0,1==c.readyState&&c.send(d.config.HeartBeat),a.serverTimeoutObj=setTimeout(function(){d.config.isqidong=!1,c.close()},a.timeout)},this.timeout)}};d.prototype.heartCheck={start:function(){g.start()},reset:function(){g.reset()}},d.prototype.config={wsUrl:"",ShInt:"0",lockReconnect:!1,HeartBeat:'{"type":"HeartBeat"}',onopen:function(){console.log("服务器已连接")},onmessage:function(){console.log("收到消息....")},onerror:function(){console.log("服务错误")},onclose:function(){console.log("服务已关闭")}},d.prototype.init=function(a){var f=this;return d.config=b.extend({},f.config,d.config,a),c=e()},d.prototype.close=function(){clearTimeout(g.timeoutObj),clearTimeout(g.serverTimeoutObj),d.config.ShInt=1,c.close()},d.prototype.send=function(a){c.send(a)},a("socket",new d)});
layui.use(['socket'], function(){

var socket = layui.socket;

socket.init({
wsUrl: 'ws://服务器地址'
,HeartBeat:'{"type":"HeartBeat"}'//心跳数据
,timeout:60000//60秒发送心跳包
,onopen:function(){
//握手成功
}
,onmessage:function(event){
var data = JSON.parse(event.data);
//收到信息
}
});

//socket.send(JSON.stringify(json));//发送

// socket.close()//断开
});
回帖
  • 火前留名,前排兜售瓜子花生矿泉水
    1 回复
  • zhongshg
    2018-3-16
    火前留名,第二排兜售荧光棒拍手神器
    0 回复
  • [汗] 做生意的留下摊位费
    0 回复
  • zhongshg
    2018-3-16
    加一个浏览器支持判断更好点,因为现在不是所有浏览器都支持websocket的
    0 回复
  • @zhongshg 没毛病[嘻嘻]
    0 回复
  • zhongshg
    2018-3-16
    0 回复
  • 666666占个位置
    0 回复
  • [鼓掌]
    0 回复
  • zhongshg
    2018-3-16
    @用个名字真难 Uncaught TypeError: Cannot read property 'timeout' of undefined
    at websocket.js:1
    at o.a (layui.js:2)
    at c (layui.js:2)
    at g (layui.js:2)
    at o.use (layui.js:2)
    at o.define (layui.js:2)
    at websocket.js:1

    g={timeout:d.config.timeout 这里报的错,请问是什么问题?
    0 回复
  • @zhongshg 咱俩一样
    0 回复
  • 报错:
    WebSocket connection to 'ws://localhost:3000/test/?' failed: Error during WebSocket handshake: Unexpected response code: 200
    0 回复
  • @zhongshg 心跳计时么有设置么???代码发出来看看
    0 回复
  • @CHC云 应该是服务端没有启动
    0 回复
  • @用个名字真难 ok了 都没问题 原来地址要ws://开头,哈哈
    0 回复
  • eluotao
    2018-4-5
    这个分享很重要...
    0 回复
  • 求助
    Uncaught TypeError: Cannot read property 'timeout' of undefined
    at socket.js:1
    at Layui.callback (layui.js:85)
    at onCallback (layui.js:152)
    at poll (layui.js:205)
    at Layui.use (layui.js:207)
    at Layui.define (layui.js:103)
    at socket.js:1
    socket.init({
    wsUrl: 'wss://api.api.cn:5345'
    ,HeartBeat:'{"type":"HeartBeat"}'//心跳数据
    ,timeout:60000//60秒发送心跳包
    ,onopen:function(){
    //握手成功
    }
    ,onmessage:function(event){
    var data = JSON.parse(event.data);
    //收到信息
    }
    });
    0 回复