客户端webSocket

2019-07-02  本文已影响0人  Jey
1. 创建socket

var ws = new WebSocket("ws://localhost:8080");

2. readyState属性返回实例对象的当前状态,共有四种。

CONNECTING:值为0,表示正在连接。
OPEN:值为1,表示连接成功,可以通信了。
CLOSING:值为2,表示连接正在关闭。
CLOSED:值为3,表示连接已经关闭,或者打开连接失败

3. webSocket.onopen
ws.onopen = function(evt) {
// socket已经连接,可以收发消息了
    console.log("Connection open ...");
    ws.send("Hello WebSockets!");
};
4. webSocket.onclose
5. webSocket.onmessage
6. webSocket.send()
7. webSocket.onerror 报错回调
cc.Class({
    extends: cc.Component,

    ctor() {
        this.handlers = {}; //
        this.ws_ = null; //
        this.heartbeat_ = null;   //心跳定时器
        this.heartCount_ = 0;  //  检测心跳5次 没有回包 发送一次建立链接
        this.reConnetTime_ = null;   // 断线检测
        this.reconnectCount_ = 5;  // 断线自动重连5次
        this.websocketIP_ = null;
        this.events = {};
        this.errorFlag = true; //断线 开启请求5次
        this.loadIngUI = null;
        this.isRepeat = false;
    },

    connect: function(ip) {
        this.creatWebSocketIp(ip)
    },

    creatWebSocketIp: function(ip) {
        var self = this;
        this.websocketIP_ = ip;

        var userinfo = cc.gg.hallNetMgr._userInfo;
        var newIp = ip
        this.ws_ = new WebSocket(newIp);
        this.ws_.onopen = function(event) {
            console.log("Send Text WS was opened. 打开链接");
            self.errorFlag = true;

            UIManager.Remove("LoadIng");
            self.removeLoadIngUI();

            self.stopConnetTime();
            self.openTheHeartbeat();
            self.setPrepareJoinRoom();

        };

        this.ws_.onmessage = function(event) {
            var strInfo = event.data;

            //消息处理  
            if (strInfo == "xxxxxxxx心跳消息") {
                // 用户收到心跳
            } else {
                var datas = JSON.parse(strInfo)
                if (typeof(self.handlers[datas.operation]) == "function") {
                    self.handlers[datas.operation](datas)
                }
            }
        };

        this.ws_.onerror = function(event) {
            
        };

        this.ws_.onclose = function(event) {
            clearInterval(self.theHeartbeat_);
            if (self.errorFlag) {
                self.openConnetTime();
            }
        };
    },

    addEvent: function(strFuncName, func) {
        if ("onopen" == strFuncName) {
            this.events[strFuncName] = func;
        }
    },

    removeEvent: function() {
        delete this.events;
    },


    // 添加自定义消息  event--消息名  func--消息回调函数
    addHandler: function(messageName, func) {
        if (this.handlers[messageName]) {
            return;
        }
        this.handlers[messageName] = func;
    },

    removeHandler: function(messageName) {
        delete this.handlers[messageName];
    },

    setPrepareJoinRoom() {
        if (this.events && this.events["onopen"]) {
            var arrayFunc = this.events["onopen"];
            arrayFunc();
        }
    },

    // 发送数据
    send: function(data) {
        if (this.ws_ && this.ws_.readyState == 1) {
            var sendData = JSON.stringify(data);
            this.ws_.send(sendData)
        }
    },

    openTheHeartbeat: function() {
        if (this.ws_ && this.ws_.readyState == 1) {
            clearInterval(this.heartbeat_);
            this.heartbeat_ = setInterval(function() {
                this.send("@");
            }.bind(this), 5000);
        }
    },

    openConnetTime: function() {
        this.showLoadIng();
        this.errorFlag = false;
        clearInterval(this.heartbeat_);
        this.reConnetTime_ = setInterval(() => {
            this.reconnectCount_--;
            this.connect(this.websocketIP_);
            if (this.reconnectCount_ <= 0) {
                this.ws_.close();
                this.removeLoadIngUI();
                this.stopConnetTime();
            }
        }, 1000);
    },

    removeAllEvent: function() {
        this.events = {};
    },

    removeAllHandler: function() {
        this.handlers = {};
    },

    stopConnetTime() {
        clearInterval(this.reConnetTime_);
        this.reConnetTime_ = null;
        this.reconnectCount_ = 5;
        // this.errorFlag = true;
    },

    showLoadIng() {
       
    },

    removeLoadIngUI() {
      
    },
})
上一篇下一篇

猜你喜欢

热点阅读