客户端连接到服务器应用程序时看不到更新的数据答案

【问题标题】：Client can not see updated data when connects to server application客户端连接到服务器应用程序时看不到更新的数据
【发布时间】：2017-09-16 17:19:42
【问题描述】：

我正在使用 node.js 从我的 Web 应用程序（服务器）上的套接字读取数据。我收到数据并在网页上进行了一些更改（例如：更改折线的颜色）但是当更改后的客户端连接时，除非将新数据发送到服务器，否则无法看到更改的颜色！那么客户端如何查看服务器上之前的更改呢？

这是我的代码

app.js

var http = require('http');
var express = require('express'),
    app = module.exports.app = express();

var server = http.createServer(app);
var io = require('socket.io').listen(server);  //pass a http.Server instance
server.listen(3000);  //listen on port 80

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

//var app = require('http').createServer(handler);
//var io = require('socket.io').listen(app);
var fs = require('fs');

var mySocket = 0;

//app.listen(3000); //Which port are we going to listen to?

function handler (req, res) {
  fs.readFile(__dirname + '/index.html', //Load and display outputs to the index.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) {
  console.log('Webpage connected'); //Confirmation that the socket has connection to the webpage
  mySocket = socket;
});

//UDP server on 41181
var dgram = require("dgram");
var server = dgram.createSocket("udp4");

server.on("message", function (msg, rinfo) {
  console.log("Broadcasting Message: " + msg); //Display the message coming from the terminal to the command line for debugging
  if (mySocket != 0) {
     mySocket.emit('field', "" + msg);
     mySocket.broadcast.emit('field', "" + msg); //Display the message from the terminal to the webpage
  }
});

server.on("listening", function () {
  var address = server.address(); //IPAddress of the server
  console.log("UDP server listening to " + address.address + ":" + address.port);
});

server.bind(41181);

index.html

<html>
<script src="/socket.io/socket.io.js"></script>
            <script>
            var socket = io.connect('http://192.168.1.14:3000');
            socket.on('field', function (data) {
                console.log(data);
                $("#field").html(data);

                switch(data) 
                {
                    case "1": 
                    $("#path1").css("stroke", "red");
                    $("#progress1").css("backgroundColor", "red");
                    break;

                }



            });
        </script>
<body>
<polyline id="path1" points="600,270 560,262 460,270 440,300" style="fill:none;stroke:green;stroke-width:3" />
</body>
</html>

【问题讨论】：

标签： javascript node.js ajax websocket socket.io

【解决方案1】：

在连接时，您必须向套接字客户端发出已经存在的更改。

var myMessage;
io.sockets.on('connection', function (socket) {
    console.log('Webpage connected'); //Confirmation that the socket has connection to the webpage
    mySocket = socket;

    mySocket.emit('field', "" + myMessage); // <<-- like this
    server.on("message", function (msg, rinfo) {
      console.log("Broadcasting Message: " + msg); //Display the message coming from the terminal to the command line for debugging
      if (mySocket != 0) {
        myMessage = msg;
        mySocket.emit('field', "" + msg);
        mySocket.broadcast.emit('field', "" + msg); //Display the message from the terminal to the webpage
      }
    });
});

【讨论】：

再次它没有工作..当颜色改变之后我作为客户端连接到页面但它看到未更改的页面。
我只是稍微编辑了代码，您可能必须使用变量来跟踪用户更改，并且您必须在连接时将其发送给客户端。
谢谢，但请你写代码。因为我是新手。我尝试了很多次，但我得到了错误。请更新您的答案。