如何修改我在node.js中提供的页面

时间:2015-07-27 12:45:29

标签: javascript angularjs node.js express highcharts

好的,我有我的server.js

var express     = require("express"),
    app         = express(),
    bodyParser  = require('body-parser');

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

app.use(express.static(__dirname + '/'));

app.post('/message', function(req, res) {
  var jsonData = req.body;
  if (jsonData.hasOwnProperty('phone1')) {
      console.log("Phone 1 is connected to", jsonData.phone1.connection,
                  "and has a downlink speed of", jsonData.phone1.dl, "Mbps");
  } else 
  if (jsonData.hasOwnProperty('phone2')) {
      console.log("Phone 2 is connected to", jsonData.phone2.connection,
                  "and has a downlink speed of", jsonData.phone2.dl, "Mbps");
  }
});

var port = 1337;
app.listen(port);
console.log("Running at Port " + port);

如你所见,当服务器在/ message上发布内容时,我想做些什么。我可以调试console.log的东西是的,但我想更改此服务器正在服务的网页上的 POST请求来自另一台服务器。此服务器仅显示它们。

如何在不更新页面的情况下执行此操作?

我也在客户端使用AngularJS,因此客户端获取JSON数据的任何方式都会很好。

我希望在我的Highcharts仪表和图表中显示数据,但是对页面元素(例如<p id="example">)进行简单的文本更新将很好地回答这个问题。

我知道我可以获取jquery到节点但我仍然缺少操作所呈现数据的窗口元素。 NW.js可能完全符合我的要求,但我还没有尝试过,但我怀疑这个问题可能还有另一种解决办法。

2 个答案:

答案 0 :(得分:0)

如果要将新内容推送到客户端(与客户端请求来自服务器的数据的流程相反),WebSockets是一个选项(有关公共库,请参阅http://socket.io/)。

或者,您可以在客户端设置长轮询。这是使用JavaScript定期使用setInterval或类似方法“轮询”服务器以获取信息。

答案 1 :(得分:0)

由于我只需要将数据从服务器发送到客户端,我最终得到了服务器发送事件(SSE),我的代码在服务器端看起来像这样:

var mypage;

app.get('/connect', function(req, res){
    res.writeHead(200, {
      'Connection': 'keep-alive',
      'Content-Type': 'text/event-stream',
      'Cache-Control': 'no-cache'
    });
    mypage = res;
});

app.post('/message', function(req, res) {
    if (mypage !== undefined) {
        mypage.write('data: '+ JSON.stringify( req.body ) +'\n\n');
    }
});

并在客户端:

$(function () {
    var server = new EventSource('/connect'),
        point1 = $("#gauge1").highcharts().series[0].points[0],
        point2 = $("#gauge2").highcharts().series[0].points[0];
    server.onmessage = function(e) {
        var jsonData = JSON.parse(e.data);
        if (jsonData.hasOwnProperty('phone1')) {
            point1.update(parseInt(jsonData.phone1.dl));
            if (jsonData.phone1.connection === "3G") {
                /* extra functionality */
            } else {
                /* extra functionality */
            }
        } else 
        if (jsonData.hasOwnProperty('phone2')) {
            point2.update(parseInt(jsonData.phone2.dl));
            if (jsonData.phone2.connection === "3G") {
                /* extra functionality */
            } else {
                /* extra functionality */
            }
        }
    };
});

我从my other question获得了有关SSE数据格式的额外帮助

Node Webkit不是我的问题的答案,因为它不能在浏览器上运行。

我收到很多帖子时仍有一些问题。我每隔0.5秒生成一条帖子,但我一直收到5条消息,然后2分钟就没有了,然后再收到5条消息。我不知道为什么会这样,但这不是这个问题的一部分所以我会发布另一个问题。