test-demo/js/index.js

 let connectError = 0;
 // 站点工况（websocket实时推送）
 (function() {

     var websocket;

     var isOpen = false;

     function initWebSocket() {
         try {
             if (typeof MozWebSocket == 'function')
                 WebSocket = MozWebSocket;

             var address = $('#ip').val() + ':' + $('#sort').val()
             var arrData = [];
             var wsUri = address;
             //  var wsUri = "wss://iot.usky.cn:55120";


             websocket = new WebSocket(wsUri);
             websocket.onopen = function(evt) {

                 if (websocket.readyState == 1) {
                     $('.data-view').append('<div class="send-status">Websocket连接 (' + wsUri + ')  已建立，正在等待数据...</div>')
                     scrollBottom();
                 }
                 var json = {};
                 json.agentid = 'admin';
                 (function() {})()
                 websocket.send(JSON.stringify(json));
             };
             websocket.onclose = function(evt) {
                 if (connectError == 0) {
                     console.log("DisConnected.");
                     $('.data-view').append('<div class="send-status">和服务器断开连接！</div>')
                     scrollBottom();
                     (function() {})()
                     //  initWebSocket();
                 }

             };
             websocket.onmessage = function(evt) {
                 var siteData = eval('(' + evt.data + ')');
                 console.log('siteData')
                 console.log(siteData)

                 //返回值渲染
                 //  if (siteData.time && aa) {   
                 if (siteData.time) {
                     $('.data-view').append('<div class="receive-time">[' + siteData.time + ' 收到]</div>');
                     $('.data-view').append('<pre class="receive-request">' + JSON.stringify(siteData, null, 2) + '</pre>')
                     scrollBottom();
                 }
             };

             websocket.onerror = function(evt) {
                 connectError = 1;
                 //  isOpen = true;
                 console.log("Error==:", evt.data);
                 (function() {
                     alert('无效的地址.');

                 })()

             };
         } catch (exception) {
             alert('无效的地址！')
             connectError = 1;
             console.log("Exception:", exception);
             (function() {})()
         }
     }


     //打开websocket   
     $('.openWebsocket').on('click', function() {
         if (!isOpen) {
             isOpen = true;
             initWebSocket();
             $('.openWebsocket').css({ 'cursor': 'not-allowed', 'opacity': '.5' })
             $('.closeWebsocket').css({ 'cursor': 'pointer', 'opacity': '1' })
         }

     })

     //关闭websocket   
     $('.closeWebsocket').on('click', function() {
         isOpen = false;
         websocket.close();
         $('.closeWebsocket').css({ 'cursor': 'not-allowed', 'opacity': '.5' })
         $('.openWebsocket').css({ 'cursor': 'pointer', 'opacity': '1' })

     })




     //站点工况点击

     $('.siteCondition').on('click', function() {
         var stationId = $('#stationId').val() //站点id
         var stationName = $('#stationName').val() //站点名称

         if (isOpen) {
             var json = {};
             json.CMD = 'getStationInfo';
             json.StationID = stationId;
             json.StationName = stationName;

             //发送时间和请求参数页面渲染
             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
             scrollBottom();

             websocket.send(JSON.stringify(json));
         } else {
             alert('请先打开websocket连接！')
             return
         }

     })

     //站点详情点击
     $('.siteDetail').on('click', function() {
         var stationId = $('#stationId').val() //站点id
         if (isOpen) {
             var json = {};
             json.CMD = 'getStationDetail';
             json.StationID = stationId;

             //发送时间和请求参数页面渲染
             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
             scrollBottom();
             websocket.send(JSON.stringify(json));

         } else {
             alert('请先打开websocket连接！')
             return

         }

     })


     //设备采集点击
     $('.getDeviceDetail').on('click', function() {
         var stationId = $('#stationId').val() //站点id
         var deviceId = $('#deviceId').val() //设备Id 

         if (isOpen) {
             var json = {};
             json.CMD = 'getDeviceDetail';
             json.StationID = stationId;
             json.DeviceID = deviceId;

             //发送时间和请求参数页面渲染
             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
             scrollBottom();
             websocket.send(JSON.stringify(json));

         } else {
             alert('请先打开websocket连接！')
             return

         }
     })


     //点位数据点击
     $('.getPointValue').on('click', function() {
         var stationId = $('#stationId').val() //站点id
         var deviceId = $('#deviceId').val() //设备Id 
         var busAddr = $('#busAddr').val() //点位编号
         var count = $('#count').val() //数量

         if (isOpen) {
             var json = {};
             json.CMD = 'getPointValue';
             json.StationID = stationId;
             json.DeviceID = deviceId;
             json.BusAddr = busAddr;
             json.Count = count;

             //发送时间和请求参数页面渲染
             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
             scrollBottom();
             websocket.send(JSON.stringify(json));

         } else {
             alert('请先打开websocket连接！')
             return

         }
     })


     //巡检记录
     $('.getPatrolRecord').on('click', function() {
         var stationId = $('#stationId').val() //站点id
         var start = $('#start').val() //起始记录
         var limit = $('#limit').val() //记录数量
         var order = $('#order').val() //序号

         if (isOpen) {
             var json = {};
             json.CMD = 'getPatrolRecord';
             json.StationID = stationId;
             json.Start = start;
             json.Limit = limit;
             json.Order = order;

             //发送时间和请求参数页面渲染
             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
             scrollBottom();
             websocket.send(JSON.stringify(json));

         } else {
             alert('请先打开websocket连接！')
             return

         }
     })


     //记录数据
     $('.getPatrolDetail').on('click', function() {
         var stationId = $('#stationId').val() //站点id
         var times = $('#time').val() //数据采集时间

         if (isOpen) {
             var json = {};
             json.CMD = 'getPatrolDetail';
             json.StationID = stationId;
             json.Time = times;

             //发送时间和请求参数页面渲染
             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
             scrollBottom();
             websocket.send(JSON.stringify(json));

         } else {
             alert('请先打开websocket连接！')
             return

         }
     })


 })()