創建一個實時網絡應用程序

Question

我必須製作一個應用程序，使用Highcharts動態更新數據。這不是一個大問題，因爲他們有一個很好的教程。這個例子工作正常。

當我不想在多個設備上共享此應用程序（使用xampp）時，我遇到了一些問題。當我打開我的web應用程序的鏈接：

http://IP-adress/ENRGYMONITOR/index.html 

顯示圖形，但沒有數據顯示或更新。這裏是我寫的javascript：

var chart; // global 
/** 
* Request data from the server, add it to the graph and set a timeout to request again 
*/ 
function requestData() { 
    $.ajax({ 
     url: 'http://localhost/live-server-data.php', 
     success: function(point) { 
      var series = chart.series[0], 
      shift = series.data.length > 20; // shift if the series is longer than 20 
      // add the point 
      chart.series[0].addPoint(eval(point), true, shift); 
      // call it again after one second 
      setTimeout(requestData, 5000); 
     }, 
     cache: false 
    }); 
} 

$(document).ready(function() { 
    chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      defaultSeriesType: 'spline', 
      events: { 
       load: requestData 
      } 
     }, 
     title: { 
      text: 'Live random data' 
     }, 
     xAxis: { 
      type: 'datetime', 
      tickPixelInterval: 150, 
      maxZoom: 20 * 1000 
     }, 
     yAxis: { 
      minPadding: 0.2, 
      maxPadding: 0.2, 
      title: { 
       text: 'Value', 
       margin: 80 
      } 
     }, 
     series: [{ 
      name: 'Random data', 
      data: [] 
     }] 
    }); 
}); 

任何人都可以讓我知道這個問題是什麼？

Answer 1

你$.ajax調用失敗：

url: 'http://localhost/live-server-data.php' 

「本地主機」這裏將是運行客戶端（網頁瀏覽器），而不是服務器發送數據的計算機。

您應該嘗試避免絕對URL。其修改爲只：

url: 'live-server-data.php' 

假設（這很重要）的是live-server-data.php是在同一個目錄中index.html