使用node.js通过外部脚本更新HTML

Using node.js to update HTML via external script?

本文关键字：脚本 更新 HTML 外部 node js 使用      更新时间：2023-09-26

我正在尝试建立一个Node.js应用程序，该应用程序将在前端提供HTML页面，同时ping IP。最终的结果将有望是一个静态网页，将显示被ping的IP的状态。

我有HTML页面运行刚刚好使用Express。它基本上只是一个带有单个<a>的静态文件，其文本和颜色由外部脚本更改。暂时，我有一个按钮来切换显示的状态，到目前为止，它看起来很好。

问题是，我如何根据从Pinger获得的结果更新HTML(下面解释)?

我有两个Node.js源文件。显然，主要是server.js:

var express = require("express"),
app     = express(),
Pinger  = require("./pinger");
app.use(express.static(__dirname));
console.log("Using static files at /");
app.use("/styles", express.static(__dirname + '/styles'));
console.log("Using stylesheets at /styles");
app.use("/res", express.static(__dirname + '/res'));
console.log("Using resources at /res");
app.listen(3000);
console.log("Listening on port 3000");
var pinger = new Pinger('google.com'); /* how the instance would be created */

还有Pinger模块:

var ping  = require('ping');
var Pinger = function() {
    this.host = arguments.length > 0 ? arguments[0] : 'google.com'; 
    this.isOnline = false;
    this.pingAll = function pingAll() {
        console.log(">>PING: " + host);
        ping.sys.probe(host, function(isAlive) {
            if (isAlive) console.log(">>PONG: " + host);
            else console.log("Unable to reach " + host);
        });
        // somehow return isAlive
    };
};
module.exports = Pinger;

显然，现在，ping的isOnline只能是假的，因为它从来没有更新过。

在一个侧面说明，我如何能够从ping.sys.probe回调内部更新isOnline ?我知道不同的作用域，我很确定，只是使用this.isOnline = isAlive将是无用的，因为this将引用回调(除非我一开始就错了，并过度考虑它)。

您需要切换到模板引擎并使页面动态。回调可以使用完成的模板调用res.send/res.end函数，该函数将被推回客户端。Checkout jade或coffeekup，如果它很简单，只需在函数中构建html，而不是使用外部模板。

你是正确的，this将引用回调函数的范围。你可以做的是创建一个对ping函数this的引用。

Func = function () {
   var self = this;
   self.isOnline = false
   asyn(function (online) {
      self.isOnline = online;       
   }
}

self将是Func的this的引用。

对于静态页面和服务器之间的通信，您可以简单地设置一个对服务器的Ajax请求，该请求将返回pinger.isOnline。或者你也可以使用socket之类的东西。IO .

app.get('/ping', function (req, res) {
   res.json(200, {"ping": pinger.isOnline});
}

现在，如果你请求/ping，你将得到一个响应与你的ping值。

您也可以使用socket.io:

npm install socket.io

一旦你设置了isOnline从内部ping，在server.js:

var socketio = require('socket.io');
var io = socketio.listen(app);
io.sockets.on('connection', function(socket) {
  var msg = 'Cannot reach host';
  if (pinger.isAlive) {
    msg = 'Host is reachable';
  }
  socket.emit('ping result', {
    msg: msg
  });
});

从你的客户端javascript:

// client.js
var socket = io.connect();
socket.on('ping result', function(data) {
  $('div.ping-result').html(data.msg);
});

在你的html中:

<script src="javascripts/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script src="javascripts/client.js"></script>
<div class="ping-result"></div>
相关文章：