【问题标题】:Log value into console that is placed in HTML将值记录到放置在 HTML 中的控制台中
【发布时间】:2012-12-28 19:14:45
【问题描述】:

我正在使用 node.js 创建一个引入串行数据的服务器。串行数据成功显示在 HTML 中;但是,我想创建一个可以保存数据的“var”。请问有人可以帮忙吗?

这是我的 index.html 页面:

<!DOCTYPE html>
<html>
    <head>
    <script src="/socket.io/socket.io.js"></script>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

    <script>

        // open a connection to the serial server:
        var socket = io.connect('http://localhost:8080');

         // when you get a serialdata event, do this:
        socket.on('serialEvent', function (data) {
            // look for the textDisplay element in the HTML below:
            var element = document.getElementById('IDTag');
            // set the stuff inside the element's HTML tags to
            // whatever the 'value' property of the received data is:
            element.innerHTML = data.value;

            });

  </script>
    </head>
    <body>
    And the latest is:
    <div id="IDTag">The RFID Tag ID will show here.</div>   
    </body>
</html>

这是我的 SerialServer.js 文档:

/*
    serialServer.js
    a node.js app to read serial strings and send them to webSocket clients
    requires:
        * node.js (http://nodejs.org/)
        * express.js (http://expressjs.com/)
        * socket.io (http://socket.io/#how-to-use)
        * serialport.js (https://github.com/voodootikigod/node-serialport)

    based on the core examples for socket.io and serialport.js

    created 21 Aug 2012
    modified 14 Oct 2012
    by Tom Igoe

    Patches and improvements suggested by Steve Klise, Lia Martinez, and Will Jennings

*/


var serialport = require("serialport"),             // include the serialport library
    SerialPort  = serialport.SerialPort,            // make a local instance of serial
    app = require('express')(),                     // start Express framework
    server = require('http').createServer(app),     // start an HTTP server
    io = require('socket.io').listen(server);       // filter the server using socket.io

var serialData = {};                                // object to hold what goes out to the client

server.listen(8080);                                // listen for incoming requests on the server

console.log("Listening for new clients on port 8080");

// open the serial port. Change the name to the name of your port, just like in Processing and Arduino:
var myPort = new SerialPort("/dev/tty.usbmodemfa131", { 
    // look for return and newline at the end of each data packet:
    parser: serialport.parsers.readline("\r\n") 
});

// respond to web GET requests with the index.html page:
app.get('/', function (request, response) {
  response.sendfile(__dirname + '/index.html');
});

// listen for new socket.io connections:
io.sockets.on('connection', function (socket) {
    // if there's a socket client, listen for new serial data:  
    myPort.on('data', function (data) {
        // set the value property of scores to the serial string:
        serialData.value = data;
        // for debugging, you should see this in Terminal:
        console.log(data);
        // send a serial event to the web client with the data:
        socket.emit('serialEvent', serialData);
    });
});

提前致谢!

【问题讨论】:

    标签: javascript node.js dom serial-port socket.io


    【解决方案1】:

    首先,我建议将所有 javascript 移动到页面末尾,在结束 body 标记(而不是 head 标记)之前。

    其次,我觉得奇怪的是你在同一个端口上运行了一个 socket.io 服务器和一个 http 服务器。

    我什至不确定这是否是运行 socket.io 的正确方法,我建议您改用官方演示(它们保证可以工作)。

    【讨论】:

    • 在同一个端口上运行 Socket.io 和 HTTP 服务器是正常且正确的,因为 Socket.io 使用 Ajax 长轮询和 WebSockets,两者都与 HTTP 完美兼容。查看Socket.io example page 上的第二个演示,“使用 Express 3 Web 框架”。
    • 感谢您的提示,我会研究一下。不过,您能帮我弄清楚如何将串行数据放入变量中,以便我也可以在控制台日志中显示它吗?
    猜你喜欢
    • 2023-03-11
    • 1970-01-01
    • 2018-06-06
    • 1970-01-01
    • 2020-07-30
    • 2021-05-30
    • 1970-01-01
    • 2019-01-25
    • 1970-01-01
    相关资源
    最近更新 更多