javascript - Socket io，JavaScript 数据未在表中更新自身

Question

我目前正在制作一个网站，其中表格中的数据每秒更新一次，但就我而言，它不起作用，请帮助我，我需要像这个网站一样更新我的表格:

我需要我的数据每秒更新一次。

我用了一切，但没有成功:

我需要我的数据每秒更新一次。

我用了一切，但没有成功。

这是我的代码。

var roundSymbol = ["GOLD", "GOLDM", "SILVER", "SILVERM","SILVERMIC", "CRUDEOIL", "CRUDEOILM","COTTON"];
var stockData = [];
var currentStock = [];

function renderStockDataTable()
{
    try
    {
        //stockData['data'] = _.where(stockData['data'], { Exchange: "MCX" });

        for (var i = 0; i < stockData['data'].length; i++) {
            if (roundSymbol.indexOf(stockData['data'][i]['Symbol']) > -1) {
                for (var key in stockData['data'][i]) {
                    if (key != 'Symbol' && key != 'Ser/Exp' && key != 'Exchange'
                        && key != 'LTPNormal'
                        && key != 'LTPRed'
                        && key != 'LTPGreen') {
                        stockData['data'][i][key] =
                            parseFloat(stockData['data'][i][key]);
                    }
                }
            }

            if (parseFloat(stockData['data'][i]['Net Change In Rs']) > 0) {
                if (stockData['data'][i]['Net Change In Rs'].toString().indexOf("+") == -1) {
                    stockData['data'][i]['Net Change In Rs'] = "+" + stockData['data'][i]['Net Change In Rs'];
                }
                stockData['data'][i]['GreenChange'] = true;
                stockData['data'][i]['RedChange'] = false;
                stockData['data'][i]['NormalChange'] = false;
            }
            else if (parseFloat(stockData['data'][i]['Net Change In Rs']) < 0) {
                stockData['data'][i]['RedChange'] = true;
                stockData['data'][i]['GreenChange'] = false;
                stockData['data'][i]['NormalChange'] = false;
            }
            else {
                stockData['data'][i]['GreenChange'] = false;
                stockData['data'][i]['RedChange'] = false;
                stockData['data'][i]['NormalChange'] = true;
            }
        }


        var stockTemplate = $('#stockTemplate').html();
        Mustache.parse(stockTemplate);
        var rendered = Mustache.render(stockTemplate, stockData);
        $('#stockBody').html(rendered);

        setTimeout(() => {
            $('.red').removeClass('red');
            $('.green').removeClass('green');
        }, 1000);
    }
    catch(e) {}
}

function initData()
{
    $('#lastUpdate').val(new Date().toLocaleString());
    $.get("", function (data) {
        stockData = data;

        try {
            for (var i = 0; i < stockData['data'].length; i++) {
                stockData['data'][i]['LTPNormal'] = true;
                stockData['data'][i]['LTPGreen'] = false;
                stockData['data'][i]['LTPRed'] = false;
            }

            $('#lastUpdate').text(new Date().toLocaleString());
            renderStockDataTable();
        }
        catch (e) { }
    });
}

$(document).ready(function () {
    initData();

    var socket = io('');
    socket.on("recieveStock", (data) => {
        if (
            data != undefined &&
            data.differences != undefined &&
            data.differences != null
        ) {
            $('#lastUpdate').text(new Date().toLocaleString());
            currentStock = JSON.parse(JSON.stringify(stockData));

            if (stockData != undefined && stockData != null
                && stockData['data'] != undefined
                && stockData['data'] != null) {
                for (var i = 0; i < stockData['data'].length; i++) {
                    var changeObj = _.findWhere(data.differences, {
                        Symbol: stockData['data'][i]["Symbol"],
                        "Ser/Exp": stockData['data'][i]["Ser/Exp"]
                    });

                    stockData['data'][i]['LTPNormal'] = true;
                    stockData['data'][i]['LTPGreen'] = false;
                    stockData['data'][i]['LTPRed'] = false;

                    if (changeObj != undefined) {
                        if (changeObj['Last Traded Price'] != undefined) {
                            if (parseFloat(changeObj['Last Traded Price']) > parseFloat(stockData['data'][i]['Last Traded Price'])) {
                                stockData['data'][i]['LTPNormal'] = false;
                                stockData['data'][i]['LTPGreen'] = true;
                                stockData['data'][i]['LTPRed'] = false;
                            }
                            else if (parseFloat(changeObj['Last Traded Price']) < parseFloat(stockData['data'][i]['Last Traded Price'])) {
                                stockData['data'][i]['LTPNormal'] = false;
                                stockData['data'][i]['LTPGreen'] = false;
                                stockData['data'][i]['LTPRed'] = true;
                            }
                            else {
                                stockData['data'][i]['LTPNormal'] = true;
                                stockData['data'][i]['LTPGreen'] = false;
                                stockData['data'][i]['LTPRed'] = false;
                            }
                        }

                        for (var key in changeObj) {
                            if (key != "Symbol" && key != "Ser/Exp" && key != 'Exchange' && key != 'LTPNormal'
                                && key != 'LTPRed'
                                && key != 'LTPGreen') {
                                stockData['data'][i][key] = changeObj[key];
                            }
                        }
                    }
                }
            }
            renderStockDataTable();
        }
    });

})

$(window).focus(function () {
    initData();
});

Answer 1

我认为您混淆了socket.io和GET请求，您正在使用的url作为socket.io连接( http://88.99.61.159:4000/getData )是一个GET请求页面，您应该使用AJAX创建请求，然后使用返回以更新您的表。

这些错误告诉您服务器上没有套接字连接。

  setInterval(() => {
    $.get('http://88.99.61.159:4000/getData', function(data, status){
      // do something with data
      alert("Data: " + data + "\nStatus: " + status);
    });
  }, 1000)