//避免重复链接
 var lockReconnect = false;
 //路径
 var wsUrl = $("#wsUrl").val();
 console.log("路径" + wsUrl);
 //webSocket对象
 var ws;
 //时间间隔
 var tt;if ("WebSocket" in window) {
     console.log("支持WebSocket")
 } else {
     alert("该浏览器不支持WebSocket")
 }//创建ws连接
 var createWebSocket = function (wsUrl) {
     try {
         //成功
         ws = new WebSocket(wsUrl);
         webSocketInit();//初始化webSocket连接函数
     } catch (e) {
         //失败
         console.log('catch');
         //重连
         //重连函数
         webSocketReconnect(wsUrl);
     }
 };
 //初始化方法,成功后执行
 var webSocketInit = function () {
     //连接关闭函数
     ws.onclose = function () {
         console.log("连接已关闭...");
         webSocketReconnect(wsUrl)//如果连接关闭则重连
     };
     //连接错误函数
     ws.onerror = function () {
         console.log("连接错误...");
         webSocketReconnect(wsUrl)//如果连接错误则重连
     };
     //连接建立,发送信息
     ws.onopen = function () {
         var message1 = {
             "type": "SUB",
             "service": "业务1-确认第一次发送信息"
         };
         ws.send(JSON.stringify(message1));//webSocket业务订阅——可以有多个业务 //发送给后端的标志,对应可以接受什么的数据
         // var message2 = {
         //     "type": "SUB",
         //     "service": "业务2"
         // };
         // ws.send(JSON.stringify(message2));
         //心跳检测启动
         heartCheck.start();//订阅业务发送之后启动心跳检测机制
     };
     //业务订阅成功后接受服务端推送消息  ,其实是个字符串
     ws.onmessage = function (evt) {
         console.log('接收到消息' + evt.data);
         $("#span").html(evt.data);    //一般这儿就可以写自己的业务逻辑
         // var DATA=JSON.parse(evt.data);
         // if (DATA.service=="业务1") {
         //     console.log("接收业务1的数据");
         //     //接收业务1的数据,并进行相关逻辑处理
         // }
         // if (DATA.service=="业务2"){
         //     console.log("接收业务1的数据");
         //     //接收业务2的数据,并进行相关逻辑处理
         // }
         //接收一次后台推送的消息,即进行一次心跳检测重置        heartCheck.reset();
     };};
 var webSocketReconnect = function (url) {
     console.log("socket 连接断开,正在尝试重新建立连接");
     if (lockReconnect) {
         return;
     }
     lockReconnect = true;
     //没连接上会一直重连,设置延迟,避免请求过多    //
     //s中清楚setTimeout的定时触发设置,之所以加个timer,是为了方便第二次赋值给timer。
     // 也就是说直接clearTImeout(timer)则timer就不存在了 再次访问就是error了。
     // 而timer&&clearTimeout(timer)则将timer 变成undefined
     tt && clearTimeout(tt);
     tt = setTimeout(function () {
        createWebSocket(url);
     }, 4000)
 }; //心跳检测  .所谓的心跳检测,就是隔一段时间向服务器仅限一次数据访问,因为长时间不使用会导致ws自动断开,
 // 一般是间隔90秒内无操作会自动断开,因此,在间隔时间内进行一次数据访问,以防止ws断开即可,
 //这里选择30秒,倒计时30秒内无操作则进行一次访问,有操作则重置计时器
 //
 //封装为键值对的形式,成为js对象,与json很相似
 var heartCheck={
     timeout: 30000,//30秒
     timeoutObj: null,
     reset: function(){//接收成功一次推送,就将心跳检测的倒计时重置为30秒
         clearTimeout(this.timeoutObj);//重置倒计时
         this.start();
     },
     start: function(){//启动心跳检测机制,设置倒计时30秒一次
         this.timeoutObj = setTimeout(function(){
             var message = {
                 "type": "t10010",
                 "service":"运行心跳业务一次 =="+ new Date()
             };
             // JSON.stringify()的作用是将 JavaScript 对象转换为 JSON 字符串
             //而JSON.parse()可以将JSON字符串转为一个对象。
             console.log("心跳一次");
             ws.send(JSON.stringify(message));//启动心跳
         },this.timeout)
     }
     //onopen连接上,就开始start及时,如果在定时时间范围内,onmessage获取到了服务端消息,
     // 就重置reset倒计时,距离上次从后端获取消息30秒后,执行心跳检测,看是不是断了。
 };//开始创建webSocket连接
 createWebSocket(wsUrl);
 ///
 function mysend() {
     var text = $("#text").val();
     console.log("text:" + text);
     //向ws发送信息
     ws.send(text);}