|  |  | 
 |  |  |     <link rel="stylesheet" th:href="@{/css/bootstrap.css}"/> | 
 |  |  |     <script th:src="@{/js/bootstrap.js}"></script> | 
 |  |  |     <style> | 
 |  |  |     .top-buffer { margin-top:10px; } | 
 |  |  |         .top-buffer { | 
 |  |  |             margin-top: 10px; | 
 |  |  |         } | 
 |  |  |     </style> | 
 |  |  | <body> | 
 |  |  | <div class="container"> | 
 |  |  |         <div class="row "> | 
 |  |  |             <div class="dropdown"> | 
 |  |  |                 相机id: | 
 |  |  |                 <select id="select"> | 
 |  |  |                 </select> | 
 |  |  |             </div> | 
 |  |  |     <div class="row "> | 
 |  |  |         <div class="dropdown"> | 
 |  |  |             相机id:<select id="select"> | 
 |  |  |         </select> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |             <div class="col-md-1 col-md-offset-1"> | 
 |  |  |                 <button id="up" type="button" class="btn btn-primary">上</button> | 
 |  |  |             </div> | 
 |  |  |             <div class="col-md-4 col-md-offset-3"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="controlZoomIn" type="button" class="btn btn-primary">调焦-</button> | 
 |  |  |                     <button id="controlZoomOut" type="button" class="btn btn-primary">调焦+</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |     </div> | 
 |  |  |     <div class="row top-buffer"> | 
 |  |  |         <div class="col-md-1 col-md-offset-1"> | 
 |  |  |             <button id="up" type="button" class="btn btn-primary">上</button> | 
 |  |  |         </div> | 
 |  |  |         <div class="row "> | 
 |  |  |             <div class="col-md-1"> | 
 |  |  |                 <button id="left" type="button" class="btn btn-primary">左</button> | 
 |  |  |             </div> | 
 |  |  |             <div class="col-md-1 col-md-offset-1"> | 
 |  |  |                 <button id="right" type="button" class="btn btn-primary">右</button> | 
 |  |  |             </div> | 
 |  |  |             <div class="col-md-4 col-md-offset-2"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="controlFocusNear" type="button" class="btn btn-primary">聚焦-</button> | 
 |  |  |                     <button id="controlFocusFar" type="button" class="btn btn-primary">聚焦+</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row "> | 
 |  |  |             <div class="col-md-1 col-md-offset-1"> | 
 |  |  |                 <button id="down" type="button" class="btn btn-primary">下</button> | 
 |  |  |             </div> | 
 |  |  |             <div class="col-md-4 col-md-offset-3"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="controlIrisOpen" type="button" class="btn btn-primary">光圈-</button> | 
 |  |  |                     <button id="controlIrisClose" type="button" class="btn btn-primary">光圈+</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |             <div class="input-group"> | 
 |  |  |                 <span class="input-group-addon">P值:</span> | 
 |  |  |                 <input id="p" class="form-control" placeholder="请输入P值"/> | 
 |  |  |             </div> | 
 |  |  |             <div class="input-group"> | 
 |  |  |                 <span class="input-group-addon">T值:</span> | 
 |  |  |                 <input id="t" class="form-control" placeholder="请输入T值"/> | 
 |  |  |             </div> | 
 |  |  |             <div class="input-group"> | 
 |  |  |                 <span class="input-group-addon">Z值:</span> | 
 |  |  |                 <input id="z" class="form-control" placeholder="请输入Z值"/> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |         <div class="col-md-4 col-md-offset-3"> | 
 |  |  |             <div class="btn-group" role="group"> | 
 |  |  |                 <button id="getPTZ" type="button" class="btn btn-default">获取ptz</button> | 
 |  |  |                 <button id="setPTZ" type="button" class="btn btn-default">设置ptz</button> | 
 |  |  |                 <button id="setPreset" type="button" class="btn btn-default">设预置点</button> | 
 |  |  |                 <button id="gotoPreset" type="button" class="btn btn-default">调预置点</button> | 
 |  |  |                 <button id="getZeroPTZ" type="button" class="btn btn-default">调用零方位角</button> | 
 |  |  |                 <button id="setZeroPTZ" type="button" class="btn btn-default">设置零方位角</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |             <div class="btn-group" role="group"> | 
 |  |  |                 <button id="FocusMode" type="button" class="btn btn-default">手动聚焦</button> | 
 |  |  |                 <div id="focusDiv" class="input-group"> | 
 |  |  |                     <span class="input-group-addon">聚焦值:</span> | 
 |  |  |                     <input id="focus" class="form-control" placeholder="聚焦值"/> | 
 |  |  |                 </div> | 
 |  |  |                 <button id="getFocusPos" type="button" class="btn btn-default">获取聚焦值</button> | 
 |  |  |                 <button id="setFocusPos" type="button" class="btn btn-default">设置聚焦值</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |             <div class="btn-group" role="group"> | 
 |  |  |                 <button id="WiperPwron" type="button" class="btn btn-default">开启雨刷</button> | 
 |  |  |                 <button id="Defogcfg" type="button" class="btn btn-default">开启透雾</button> | 
 |  |  |                 <button id="Infrarecfg" type="button" class="btn btn-default">开启红外</button> | 
 |  |  |                 <button id="HeateRpwron" type="button" class="btn btn-default">开启云台加热</button> | 
 |  |  |                 <button id="CameraDeicing" type="button" class="btn btn-default">开启镜头加热</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |             <div class="btn-group" role="group"> | 
 |  |  |                 <button id="voice" type="button" class="btn btn-default">开始语音对讲</button> | 
 |  |  |                 <button id="record" type="button" class="btn btn-default">开始录像</button> | 
 |  |  |                 <button id="realCutPic" type="button" class="btn btn-default">实时抓图</button> | 
 |  |  |                 <button id="saveCutPic" type="button" class="btn btn-default">存储抓图</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="row top-buffer"> | 
 |  |  |             <div class="col-md-6"> | 
 |  |  |                 <img class="thumbnail" id="imgContainer" style="width: 500px; height: 400px;padding: 5px 5px;"/> | 
 |  |  |             </div> | 
 |  |  |             <div class="col-md-6"> | 
 |  |  |                 <video id="video" muted autoplay loop controls  style="width: 800px; height: 100%; object-fit: fill" /> | 
 |  |  |                 <button id="controlZoomIn" type="button" class="btn btn-primary">调焦-</button> | 
 |  |  |                 <button id="controlZoomOut" type="button" class="btn btn-primary">调焦+</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </div> | 
 |  |  | </body> | 
 |  |  | <script th:inline="javascript"> | 
 |  |  |     var cameraId, opt, token; | 
 |  |  |     <div class="row "> | 
 |  |  |         <div class="col-md-1"> | 
 |  |  |             <button id="left" type="button" class="btn btn-primary">左</button> | 
 |  |  |         </div> | 
 |  |  |         <div class="col-md-1 col-md-offset-1"> | 
 |  |  |             <button id="right" type="button" class="btn btn-primary">右</button> | 
 |  |  |         </div> | 
 |  |  |         <div class="col-md-4 col-md-offset-2"> | 
 |  |  |             <div class="btn-group" role="group"> | 
 |  |  |                 <button id="controlFocusNear" type="button" class="btn btn-primary">聚焦-</button> | 
 |  |  |                 <button id="controlFocusFar" type="button" class="btn btn-primary">聚焦+</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </div> | 
 |  |  |     <div class="row "> | 
 |  |  |         <div class="col-md-1 col-md-offset-1"> | 
 |  |  |             <button id="down" type="button" class="btn btn-primary">下</button> | 
 |  |  |         </div> | 
 |  |  |         <div class="col-md-4 col-md-offset-3"> | 
 |  |  |             <div class="btn-group" role="group"> | 
 |  |  |                 <button id="controlIrisOpen" type="button" class="btn btn-primary">光圈-</button> | 
 |  |  |                 <button id="controlIrisClose" type="button" class="btn btn-primary">光圈+</button> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </div> | 
 |  |  |     <div class="row"> | 
 |  |  |         <div class="col-md-6"> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <div class="input-group"> | 
 |  |  |                     <span class="input-group-addon">目的坐标值:</span> | 
 |  |  |                     <input id="targetPostion" class="form-control" placeholder="目的坐标"/> | 
 |  |  |                     <button id="setTargetPostion" type="button" class="btn btn-default">指向坐标</button> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="input-group"> | 
 |  |  |                     <span class="input-group-addon">P值:</span> | 
 |  |  |                     <input id="p" class="form-control" placeholder="请输入P值"/> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="input-group"> | 
 |  |  |                     <span class="input-group-addon">T值:</span> | 
 |  |  |                     <input id="t" class="form-control" placeholder="请输入T值"/> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="input-group"> | 
 |  |  |                     <span class="input-group-addon">Z值:</span> | 
 |  |  |                     <input id="z" class="form-control" placeholder="请输入Z值"/> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="getPTZ" type="button" class="btn btn-default">获取ptz</button> | 
 |  |  |                     <button id="setPTZ" type="button" class="btn btn-default">设置ptz</button> | 
 |  |  |                     <button id="setPreset" type="button" class="btn btn-default">设预置点</button> | 
 |  |  |                     <button id="gotoPreset" type="button" class="btn btn-default">调预置点</button> | 
 |  |  |                     <button id="getZeroPTZ" type="button" class="btn btn-default">调用零方位角</button> | 
 |  |  |                     <button id="setZeroPTZ" type="button" class="btn btn-default">设置零方位角</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="FocusMode" type="button" class="btn btn-default">手动聚焦</button> | 
 |  |  |                     <div id="focusDiv" class="input-group"> | 
 |  |  |                         <span class="input-group-addon">聚焦值:</span> | 
 |  |  |                         <input id="focus" class="form-control" placeholder="聚焦值"/> | 
 |  |  |                     </div> | 
 |  |  |                     <button id="getFocusPos" type="button" class="btn btn-default">获取聚焦值</button> | 
 |  |  |                     <button id="setFocusPos" type="button" class="btn btn-default">设置聚焦值</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="WiperPwron" type="button" class="btn btn-default">开启雨刷</button> | 
 |  |  |                     <button id="Defogcfg" type="button" class="btn btn-default">开启透雾</button> | 
 |  |  |                     <button id="Infrarecfg" type="button" class="btn btn-default">开启红外</button> | 
 |  |  |                     <button id="HeateRpwron" type="button" class="btn btn-default">开启云台加热</button> | 
 |  |  |                     <button id="CameraDeicing" type="button" class="btn btn-default">开启镜头加热</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <div class="btn-group" role="group"> | 
 |  |  |                     <button id="voice" type="button" class="btn btn-default">开始语音对讲</button> | 
 |  |  |                     <button id="record" type="button" class="btn btn-default">开始录像</button> | 
 |  |  |                     <button id="realCutPic" type="button" class="btn btn-default">实时抓图</button> | 
 |  |  |                     <button id="saveCutPic" type="button" class="btn btn-default">存储抓图</button> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <div class="col-md-6"> | 
 |  |  |                     <img class="thumbnail" id="imgContainer" style="width: 500px; height: 300px;"/> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="col-md-1"/> | 
 |  |  |         <div class="col-md-5"> | 
 |  |  |             <div class="row top-buffer"> | 
 |  |  |                 <video id="video" muted autoplay loop controls style="width: 800px; height: 100%; object-fit: fill;"/> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </div> | 
 |  |  | </div> | 
 |  |  | <script th:inline="javascript" th:type="module"> | 
 |  |  |  | 
 |  |  |     var cameraId, opt, optOpen, optClose, token; | 
 |  |  |     window.onload = function () { | 
 |  |  |         console.log(RTCRtpReceiver.getCapabilities('video').codecs) | 
 |  |  |         $.ajax({ | 
 |  |  |             url: "../hik/list", | 
 |  |  |             url: "../cameraSdk/list", | 
 |  |  |             type: "get", | 
 |  |  |             success: function (data) { | 
 |  |  |                 console.log(data); | 
 |  |  | 
 |  |  |                 for (var i = 0; i < arr.length; i++) { | 
 |  |  |                     console.log(arr[i].id); | 
 |  |  |                     var camera = { | 
 |  |  |                         type: arr[i].gdtype, | 
 |  |  |                         name: arr[i].name, | 
 |  |  |                         factory: arr[i].factory, | 
 |  |  |                         ipaddr: arr[i].ip, | 
 |  |  |                         username: arr[i].username, | 
 |  |  |                         password: arr[i].password, | 
 |  |  |                         port: arr[i].rtspPort | 
 |  |  |                         port: arr[i].rtspPort, | 
 |  |  |                         longitude: arr[i].longitude, | 
 |  |  |                         latitude: arr[i].latitude, | 
 |  |  |                         altitude: arr[i].altitude | 
 |  |  |                     }; | 
 |  |  |                     cameraMap.set(arr[i].id, camera); | 
 |  |  |                     //先创建好select里面的option元素 | 
 |  |  | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }) | 
 |  |  |  | 
 |  |  |         opt = {"username": "admin", "password": "admin123"}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  | 
 |  |  |     } | 
 |  |  |     //云台上下左右 | 
 |  |  |     $("#up").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 2; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |  | 
 |  |  |     }) | 
 |  |  |     $("#up").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 2; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#down").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 8; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#down").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 8; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#left").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 4; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#left").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 4; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#right").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 6; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#right").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 6; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     //变倍 | 
 |  |  |     $("#controlZoomIn").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 10; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlZoomIn").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 10; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlZoomOut").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 11; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlZoomOut").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 11; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     //变焦 | 
 |  |  |     $("#controlFocusNear").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 12; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlFocusNear").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 12; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlFocusFar").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 13; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlFocusFar").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 13; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     //光圈 | 
 |  |  |     $("#controlIrisOpen").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 14; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlIrisOpen").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 14; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlIrisClose").mousedown(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 15; | 
 |  |  |         var enable = true; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  |     }) | 
 |  |  |     $("#controlIrisClose").mouseup(function () { | 
 |  |  |         var url = "../hik/PTZControlWithSpeed"; | 
 |  |  |         var url = "../cameraSdk/PTZControlWithSpeed"; | 
 |  |  |         var code = 15; | 
 |  |  |         var enable = false; | 
 |  |  |         commondMethod(url, code, enable); | 
 |  |  | 
 |  |  |  | 
 |  |  |     $("#setPreset").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1, "speed": 8, "presetIndex": 1}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1, "speed": 8, "presetIndex": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/setPreset", | 
 |  |  |             url: "../cameraSdk/setPreset", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  | 
 |  |  |     }) | 
 |  |  |     $("#gotoPreset").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1, "speed": 8, "presetIndex": 1}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1, "speed": 8, "presetIndex": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/gotoPreset", | 
 |  |  |             url: "../cameraSdk/gotoPreset", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  | 
 |  |  |     }) | 
 |  |  |     $("#getPTZ").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/getPTZ", | 
 |  |  |             url: "../cameraSdk/getPTZ", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  | 
 |  |  |         var z = $('#z').val(); | 
 |  |  |         //定义一个带有Map字段的实体对象 | 
 |  |  |         var myEntity = { | 
 |  |  |             channelNum: 1, | 
 |  |  |             chanNo: 1, | 
 |  |  |             cameraId: cameraId, | 
 |  |  |             ptzMap: { | 
 |  |  |                 p: p, | 
 |  |  | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/setPTZ", | 
 |  |  |             url: "../cameraSdk/setPTZ", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(myEntity), | 
 |  |  |             success: function (data) { | 
 |  |  |                 console.log(data); | 
 |  |  |             } | 
 |  |  |         }) | 
 |  |  |     }) | 
 |  |  |     $("#setTargetPostion").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         var camera = cameraMap.get(cameraId); | 
 |  |  |         var camP = camera.longitude + ',' + camera.latitude + ',' + camera.altitude; | 
 |  |  |         var targetP = $('#targetPostion').val(); | 
 |  |  |         //定义一个带有Map字段的实体对象 | 
 |  |  |         var myEntity = { | 
 |  |  |             chanNo: 1, | 
 |  |  |             cameraId: cameraId, | 
 |  |  |             targetPosition: targetP, | 
 |  |  |             camPosition: camP, | 
 |  |  |         }; | 
 |  |  |         console.log(myEntity) | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../cameraSdk/setTargetPosition", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(myEntity), | 
 |  |  | 
 |  |  |     }) | 
 |  |  |     $("#setZeroPTZ").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/setZeroPTZ", | 
 |  |  |             url: "../cameraSdk/setZeroPTZ", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  | 
 |  |  |     }) | 
 |  |  |     $("#WiperPwron").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1, "speed": 8, "enable": true, "code": 16}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1, "speed": 8, "enable": true, "code": 16}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/PTZControlWithSpeed", | 
 |  |  |             url: "../cameraSdk/PTZControlWithSpeed", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  | 
 |  |  |     var defogflag = true; | 
 |  |  |     $("#Defogcfg").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         optOpen = {"cameraId": cameraId, "channelNum": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "channelNum": 1, "enable": false}; | 
 |  |  |         optOpen = {"cameraId": cameraId, "chanNo": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "chanNo": 1, "enable": false}; | 
 |  |  |         if (defogflag) { | 
 |  |  |             $(this).text("关闭透雾"); | 
 |  |  |             defogflag = false; | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/defogcfg", | 
 |  |  |                 url: "../cameraSdk/defogcfg", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optOpen), | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/defogcfg", | 
 |  |  |                 url: "../cameraSdk/defogcfg", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optClose), | 
 |  |  | 
 |  |  |     var infrareflag = true; | 
 |  |  |     $("#Infrarecfg").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         optOpen = {"cameraId": cameraId, "channelNum": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "channelNum": 1, "enable": false}; | 
 |  |  |         optOpen = {"cameraId": cameraId, "chanNo": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "chanNo": 1, "enable": false}; | 
 |  |  |         if (infrareflag) { | 
 |  |  |             $(this).text("关闭红外"); | 
 |  |  |             infrareflag = false; | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/infrarecfg", | 
 |  |  |                 url: "../cameraSdk/infrarecfg", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optOpen), | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/infrarecfg", | 
 |  |  |                 url: "../cameraSdk/infrarecfg", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optClose), | 
 |  |  | 
 |  |  |     var focusModeflag = true; | 
 |  |  |     $("#FocusMode").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         optOpen = {"cameraId": cameraId, "channelNum": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "channelNum": 1, "enable": false}; | 
 |  |  |         optOpen = {"cameraId": cameraId, "chanNo": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "chanNo": 1, "enable": false}; | 
 |  |  |         if (focusModeflag) { | 
 |  |  |             $(this).text("自动聚焦"); | 
 |  |  |             focusModeflag = false; | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/focusMode", | 
 |  |  |                 url: "../cameraSdk/focusMode", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optOpen), | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/focusMode", | 
 |  |  |                 url: "../cameraSdk/focusMode", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optClose), | 
 |  |  | 
 |  |  |             }) | 
 |  |  |         } | 
 |  |  |     }) | 
 |  |  |     $("#getFocusPos").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |                 headers: { | 
 |  |  |                     'Accept': 'application/json', | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../cameraSdk/getFocusPos", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(opt), | 
 |  |  |                 success: function (datas) { | 
 |  |  |                     console.log(datas); | 
 |  |  |                     $("#focus").val(datas.data); | 
 |  |  |                 } | 
 |  |  |             }) | 
 |  |  |     }) | 
 |  |  |     var heateRpwronflag = true; | 
 |  |  |     $("#HeateRpwron").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         optOpen = {"cameraId": cameraId, "channelNum": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "channelNum": 1, "enable": false}; | 
 |  |  |         optOpen = {"cameraId": cameraId, "chanNo": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "chanNo": 1, "enable": false}; | 
 |  |  |         if (heateRpwronflag) { | 
 |  |  |             $(this).text("关闭云台加热"); | 
 |  |  |             heateRpwronflag = false; | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/heateRpwron", | 
 |  |  |                 url: "../cameraSdk/heateRpwron", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optOpen), | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/heateRpwron", | 
 |  |  |                 url: "../cameraSdk/heateRpwron", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optClose), | 
 |  |  | 
 |  |  |     var CameraDeicingflag = true; | 
 |  |  |     $("#CameraDeicing").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         optOpen = {"cameraId": cameraId, "channelNum": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "channelNum": 1, "enable": false}; | 
 |  |  |         optOpen = {"cameraId": cameraId, "chanNo": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "chanNo": 1, "enable": false}; | 
 |  |  |         if (CameraDeicingflag) { | 
 |  |  |             $(this).text("关闭镜头加热"); | 
 |  |  |             CameraDeicingflag = false; | 
 |  |  | 
 |  |  |                     'Accept': 'application/json', | 
 |  |  |                     'Content-Type': 'application/json' | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/cameraDeicing", | 
 |  |  |                 url: "../cameraSdk/cameraDeicing", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optOpen), | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/cameraDeicing", | 
 |  |  |                 url: "../cameraSdk/cameraDeicing", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optClose), | 
 |  |  | 
 |  |  |     }) | 
 |  |  |     $("#realCutPic").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/captureJPEGPicture", | 
 |  |  |             url: "../cameraSdk/captureJPEGPicture", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  |             success: function (data) { | 
 |  |  |                 console.log(data.data); | 
 |  |  |                 $("#imgContainer").attr("src","data:image/png;base64,"+data.data); | 
 |  |  |                 $("#imgContainer").attr("src", "data:image/png;base64," + data.data); | 
 |  |  |             } | 
 |  |  |         }) | 
 |  |  |     }) | 
 |  |  |     $("#saveCutPic").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  |                 'Content-Type': 'application/json', | 
 |  |  |                 'Authorization': token | 
 |  |  |             }, | 
 |  |  |             url: "../hik/picCutCate", | 
 |  |  |             url: "../cameraSdk/picCutCate", | 
 |  |  |             type: "post", | 
 |  |  |             dataType: "json", | 
 |  |  |             data: JSON.stringify(opt), | 
 |  |  |             success: function (data) { | 
 |  |  |                 console.log(data.data); | 
 |  |  |                 $('#imgContainer').attr('src', data.data); | 
 |  |  |                 setTimeout(() => { | 
 |  |  |                     $('#imgContainer').attr('src', data.data); | 
 |  |  |                 }, 1000 ) | 
 |  |  |  | 
 |  |  |             } | 
 |  |  |         }) | 
 |  |  |     }) | 
 |  |  |     var recordflag = true; | 
 |  |  |     $("#record").click(function () { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         optOpen = {"cameraId": cameraId, "channelNum": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "channelNum": 1, "enable": false}; | 
 |  |  |         optOpen = {"cameraId": cameraId, "chanNo": 1, "enable": true}; | 
 |  |  |         optClose = {"cameraId": cameraId, "chanNo": 1, "enable": false}; | 
 |  |  |         if (recordflag) { | 
 |  |  |             $(this).text("停止录像"); | 
 |  |  |             recordflag = false; | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/record", | 
 |  |  |                 url: "../cameraSdk/record", | 
 |  |  |                 type: "post", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optOpen), | 
 |  |  | 
 |  |  |                     'Content-Type': 'application/json', | 
 |  |  |                     'Authorization': token | 
 |  |  |                 }, | 
 |  |  |                 url: "../hik/record", | 
 |  |  |                 url: "../cameraSdk/record", | 
 |  |  |                 dataType: "json", | 
 |  |  |                 data: JSON.stringify(optClose), | 
 |  |  |                 type: "post", | 
 |  |  | 
 |  |  |     /*云台公共方法*/ | 
 |  |  |     function commondMethod(url, code, enable) { | 
 |  |  |         cameraId = $('#select option:selected').val(); | 
 |  |  |         opt = {"cameraId": cameraId, "channelNum": 1, "speed": 8, "enable": enable, "code": code}; | 
 |  |  |         opt = {"cameraId": cameraId, "chanNo": 1, "speed": 4, "enable": enable, "code": code}; | 
 |  |  |         $.ajax({ | 
 |  |  |             headers: { | 
 |  |  |                 'Accept': 'application/json', | 
 |  |  | 
 |  |  |             } | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     let webRtcServer = null; | 
 |  |  |     let videoMap = new Map(); | 
 |  |  |     $('video').click(function (e) { | 
 |  |  | 
 |  |  |             var cameraId = $('#select option:selected').val(); | 
 |  |  |             let camera = cameraMap.get(cameraId); | 
 |  |  |             console.log(camera); | 
 |  |  |             if (camera.type == "ys") { | 
 |  |  |             if (camera.factory == "3") { | 
 |  |  |                 realViewYs("127.0.0.1", ID, camera.username, camera.password, camera.ipaddr, camera.port); | 
 |  |  |             } else if (camera.type == "dh") { | 
 |  |  |             } else if (camera.factory == "2") { | 
 |  |  |                 realViewDh("127.0.0.1", ID, camera.username, camera.password, camera.ipaddr, camera.port); | 
 |  |  |             } else { | 
 |  |  |                 realViewHik("192.168.1.15", ID, camera.username, camera.password, camera.ipaddr,  camera.port); | 
 |  |  |                 realViewHik("127.0.0.1", ID, camera.username, camera.password, camera.ipaddr, camera.port); | 
 |  |  |             } | 
 |  |  |         } | 
 |  |  |     }); | 
 |  |  |  | 
 |  |  |     //预览海康相机 | 
 |  |  |     function realViewHik(serverip, elem, username, password, ipaddr, port) { | 
 |  |  |         webRtcServer = new WebRtcStreamer(elem, "http://" + serverip + ":8000"); | 
 |  |  |        // webRtcServer = new WebRtcStreamer(elem, "http://" + serverip + ":8000"); | 
 |  |  |         webRtcServer = new WebRtcStreamer(elem, "http://192.168.1.227:8000"); | 
 |  |  |         let rtspUrl = "rtsp://" + username + ":" + password + "@" + ipaddr + ":" + port + "/ch1/main/av_stream"; | 
 |  |  |         let option = "rtptransport=tcp"; | 
 |  |  |         console.log("rtsp地址:" + rtspUrl); | 
 |  |  | 
 |  |  |         webRtcServer.disconnect(); | 
 |  |  |     } | 
 |  |  | </script> | 
 |  |  | </body> | 
 |  |  | </html> |