@*@page @model Applications.UniversalApi_WebConsole_App.Views.TankDetails.TestModel @{ }*@ @{ // Layout = null; } <script src="~/js/mqtt.min.js"></script> <script src="~/js/Chart.bundle.js"></script> <script src="~/js/jquery-3.4.1.min.js"></script> <body style="width:1250px;height:780px;background-color:aqua"> <div id="test_div" style=""> </div> </body> <script> //$(document).ready(function () { var hostname = 'localhost', //'192.168.1.2', port = 8384, clientId = 'mqttjs_' + (Math.random() * 1000000).toString(), timeout = 5000, keepAlive = 100, cleanSession = false, mqttVersion = 3, ssl = false; var options = { //mqtt客户端的id,这里面应该还可以加上其他参数,具体看官方文档 clientId: 'mqttjs_' + (Math.random() * 1000000).toString(), timeout: timeout, useSSL: false } //浏览器采用websocket协议,host主机地址为192.168.0.200,端口为9001,路径为/mqtt //var client = mqtt.connect("ws://localhost:8384/mqtt", options); // you add a ws:// url here var client = mqtt.connect("ws://localhost:8384/mqtt", options); ////建立连接 client.on('connect', function () { var a = document.getElementById("testmqqt"); if (a != null) a.innerHTML = "connected"; //订阅主题 presence client.subscribe('/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTankInventoryAsync_reply', function (err) { if (!err) { console.log("Subscribe TankReadig success"); //client.publish('/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTankReadingsAsync'); } else { //打印错误 if (a != null) a.innerHTML = err; } }); client.subscribe('/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTanksAsync_reply', function (err) { if (!err) { console.log("Subscribe getTAnk success"); client.publish('/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTanksAsync',"[]"); //client.publish('/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTankReadingsAsync'); } else { //打印错误 if (a != null) a.innerHTML = err; } }); }); //如果连接错误,打印错误 //如果连接错误,打印错误 client.on('error', function (err) { var a = document.getElementById("test_div"); if (a != null) a.innerHTML = err; client.end(); }); //如果client订阅主题成功,那么这里就是当接收到自己订阅主题的处理逻辑 client.on('message', function (topic, message) { var a = document.getElementById("testmqqt"); //if (a != null) a.innerHTML = message.toString(); if (topic == "/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTankInventoryAsync_reply") { //TableRowADD(JSON.parse(message.toString())); //GenerateHeadView(); //GenerateFootView(); //GenerateTanksView(JSON.parse(message.toString()), totaltanksnumber); //TankDataGet(JSON.parse(message.toString())); } if (topic == "/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTanksAsync_reply") { //TankIDGet(JSON.parse(message.toString())); //GenerateFootView(); //var s = message.toString(); //GenerateTankView(JSON.parse(message.toString())); } }); //function TankDataGet(datas) { // datas.forEach(function(d){ // FuelAmount.innerHTML = "实时油量:" + FormatFloat(d.FuelVolume, 0) + "升"; // FuelAmount.style = "font-size:16px; color:black;font-weight:bold;height:30px;width:180px;margin-top:16px;margin-left:0px"; // FuelVolume.innerHTML = "实时油位:" + FormatFloat(d.FuelHeight, 0) + "mm"; // FuelVolume.style = "font-size:16px; color:black;font-weight:bold;height:30px;width:180px;margin-top:6px;margin-left:0px"; // RemainingSpace.innerHTML = "剩余空间:" + FormatFloat(d.FuelTCVolume, 0) + "升"; // RemainingSpace.style = "font-size:16px; color:black;font-weight:bold;height:30px;width:180px;margin-top:6px;margin-left:0px"; // Temperature.innerHTML = "实时油温:" + FormatFloat(d.Temperture, 0) + "℃"; // Temperature.style = "font-size:16px; color:black;font-weight:bold;height:30px;width:180px;margin-top:6px;margin-left:0px"; // WaterLevel.innerHTML = "实时水位:" + FormatFloat(d.WaterHeight, 0) + "mm"; // WaterLevel.style = "font-size:16px; color:black;font-weight:bold;height:30px;width:180px;margin-top:6px;margin-left:0px"; // }) //} //}) //function TankIDGet(message) { // if (message == null) { // console.log("Invalid message got in tanks view"); // return; // } // var d = message; // totaltanksnumber = message.length; // for (i = 0; i < totaltanksnumber; ++i) { // currentFuelID = d[i].Product.ProductLabel; // currentFuelKind = d[i].Label; // currentTankID = d[i].TankNumber; // tanknumber["Parameters:"].tanknumber = i; // client.publish('/sys/VeederRoot_ATG_Console_Tcp/VeederRoot_ATG_Console.Handler/thing/service/GetTankInventoryAsync', JSON.stringify(tanknumber)); // } //} </script>