Question

因此，我的程序从udp服务器获取数据，我只想在更新时按1逐1将其显示在HTML页的列表中。在控制台中可以使用，但是如何在页面上执行呢？

我收到了此代码

index.js

var dgram = require('dgram'),
    server = dgram.createSocket('udp4');  //this server gets data from udp packet

var msg;

server.on('message', function (message, rinfo) {
  msg = message.toString('ascii');   //udp packet data to string 
  console.log(msg);
});

server.on('listening', function () {
  var address = server.address();
  console.log('UDP Server listening ' + address.address + ':' + address.port);
});
server.bind(8007); 

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

io.on('connection', function(socket) {
  var tm = setInterval(function() {
          socket.emit('datafromserver', {'datafromserver': msg});
  }, 500);
  socket.on('disconnect', function() {
      clearInterval(tm);
  });
});


app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

http.listen(3000, function(){
  console.log('listening on *:3000');
});

和html页面

<!doctype html>
<html>
  <head>
    <title>Scoreboard</title>
    <style>
      * { margin: 0; padding: 0; box-sizing: border-box; }
    </style>
  </head>
  <body>
      <script src="/socket.io/socket.io.js"></script>
      <script src="https://code.jquery.com/jquery-1.11.1.js"></script>
      <script>
        var socket = io.connect('http://192.168.1.162:3000/');  
            socket.on('#dataonscreen', function(data) {
            $('#dataonscreen').html(data.datafromserver);
            console.log(data.datafromserver);
            });
      </script>
    <ul id="dataonscreen"></ul>
  </body>
</html>

我不明白为什么它不起作用以及如何解决。请帮忙！

Answer 1

您的socket.io服务器发出datafromserver，而您的代码侦听#dataonscreen

更改其中任一值，使其具有相同的值，并且您的代码应正常工作。我不确定您是否有控制台输出，因为未监听事件

如何显示从套接字io到HTML页面列表的数据

1 个答案: