Question

我正在尝试使用socket.io将数据从node.js脚本传输到HTML网页。 node.js脚本正在执行一个函数（使用BeagleBone Black传感器）并返回一定值。我想通过套接字将此值传输到HTML页面。然后，我希望HTML页面显示此值。我已经能够让网页记录Chrome的Javascript控制台上的所有内容。我不明白为什么数据没有打印在实际页面上。

kwargs

HTML文件：

// Install socket.io: terminal, goto /var/lib/cloud9 and enter: npm install socket.io

var app = require('http').createServer(handler);

var io = require('socket.io').listen(app);

var fs = require('fs');

var b = require('bonescript');

var fulldata = 0;
// count how many pulses
var pulses = 0;
// track the state of the pulse pin
var lastflowpinstate;
//time between pulses
var lastflowratetimer = 0;
// used to calculate a flow rate
var flowrate;
// Interrupt is called once a millisecond, looks for any pulses 
var value = 0;

var liters = 0;


app.listen(8090);

/* socket.io options go here

io.set('log level', 2);   // reduce logging - set 1 for warn, 2 for info, 3 for debug

io.set('browser client minification', true);  // send minified client

io.set('browser client etag', true);  // apply etag caching logic based on version number
*/

console.log('Server running on: http://' + getIPAddress() + ':8090');

var Sensor = "P8_19";
b.pinMode('P8_19', b.INPUT);
console.log(b.digitalRead('P8_19'));

function handler (req, res) {

  if (req.url == "/favicon.ico"){   // handle requests for favico.ico

  res.writeHead(200, {'Content-Type': 'image/x-icon'} );

  res.end();

  //console.log('favicon requested');

  return;

  }

  fs.readFile('SensorHTML.html',    // load html file

  function (err, data) {

    if (err) {

      res.writeHead(500);

      return res.end('Error loading index.html');

    }

    res.writeHead(200);

    res.end(data);

  });

}



io.sockets.on('connection', function(socket) {

    setInterval(function() {

            //doSomething();
            b.pinMode('P8_19', b.INPUT);
            value = b.digitalRead('P8_19');

            if (value == lastflowpinstate) 
            {
            lastflowratetimer++;
            //return; // nothing changed!
            }

            if (value == '1') 
            {
               //low to high transition!
               pulses++;
            }

            lastflowpinstate = value;
            flowrate = 1000.0;
            flowrate /= lastflowratetimer;  // in hertz
            lastflowratetimer = 0;

            liters = pulses / (450);
            fulldata += liters;
            JSON.stringify(fulldata);
            //send temperature reading out to connected clients
            socket.emit('water', {'water': fulldata});

    }, 500);

    //function doSomething() {

 });

  // Get server IP address on LAN
  function getIPAddress() {

  var interfaces = require('os').networkInterfaces();

  for (var devName in interfaces) {

    var iface = interfaces[devName];

    for (var i = 0; i < iface.length; i++) {

      var alias = iface[i];

      if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal)

        return alias.address;

    }

  }

  return '0.0.0.0';
}

任何帮助或见解都将不胜感激。

Answer 1

在客户端，更改：

$('#water').html(data.fulldata);
console.log(data.fulldata);

到此：

$('#water').html(data.water);
console.log(data.water);

您在服务器上设置的媒体资源名称为water，而不是fulldata。

此外，在服务器上，删除此行：

JSON.stringify(fulldata)

不需要将仅作为对象的属性传递的单个数字进行字符串化。事实上，它可能会给你带来麻烦。

在服务器上，您还需要将来自呼叫的计时器保存到setInterval()，这样您就可以在断开套接字时clearInterval()。我建议将间隔计时器句柄存储为套接字对象本身的自定义属性，因为这样可以更容易地在'disconnect'事件中进行访问。

以下是如何执行此操作的示例：

io.on('connection', function(socket) {

    var tm = setInterval(function() {

            //doSomething();
            b.pinMode('P8_19', b.INPUT);
            value = b.digitalRead('P8_19');

            if (value == lastflowpinstate) 
            {
            lastflowratetimer++;
            //return; // nothing changed!
            }

            if (value == '1') 
            {
               //low to high transition!
               pulses++;
            }

            lastflowpinstate = value;
            flowrate = 1000.0;
            flowrate /= lastflowratetimer;  // in hertz
            lastflowratetimer = 0;

            liters = pulses / (450);
            fulldata += liters;
            //send temperature reading out to connected clients
            socket.emit('water', {'water': fulldata});

    }, 500);

    socket.on('disconnect', function() {
        clearInterval(tm);
    });

    //function doSomething() {

 });

Answer 2

感谢您的提示（关于关闭计时器）。我在服务器代码中进行了一些编辑，但我不确定它们是否正确。

    io.on('connection', function(socket) {

            function to_start()
            {
                tm=window.setInterval('timer()', 500);
            }

            to_start();

            function timer()
            {
               ....
            }

            socket.on('disconnect', function () {
                window.clearInterval(tm);
            });

 });

如何从socket.io连接显示数据？

2 个答案: