javascript - 如何指定数据文件的路径？

Question

我正在学习 javascript 和 AJAX。我正在创建一个网页，该网页应显示动态变化的数据，并在数据文件中的数据发生变化时刷新网页。我四处寻找一种方法并找到了一些我可以使用的东西。它使用两个 javscript 函数 ReloadData 和 processReqChange(见下文)。这些函数位于名为 reloader.js 的文件中。当文件 liveData 中的数据发生变化时，代码将更新网页。 reloader.js 文件位于网页结构的根目录中，例如与index.html 相同的目录。文件 liveData 也包含在该目录中。如果我手动更改 liveData 中的数据，网页上的数据将会更改。 liveData 文件通过以下行访问:

url = 'liveData?' + now.getTime();

问题是我有一个 C 程序，它在/home/myUsername/liveData 中生成一个数据文件。我想让 reloader.js 读取/home/myUsername/中的 liveData 文件。如果我将 url 行更改为:

`url = '/home/myUsername/liveData?' + now.getTime();`

我收到一条错误消息，指出找不到 liveData 文件。我怎样才能解决这个问题？谢谢J

var req;
function reloadData()
{
   var now = new Date();
   url = 'liveData?' + now.getTime(); // file that contains data to be displayed
   try {
      req = new XMLHttpRequest();
   } catch (e) {
      try {
         req = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
         try {
            req = new ActiveXObject("Microsoft.XMLHTTP");
         } catch (oc) {
            alert("No AJAX Support");
            return;
         }
      }
   }

   req.onreadystatechange = processReqChange;
   req.open("GET", url, true);
   req.send(null);
}

function processReqChange()
{
   // If req shows "complete"
   if (req.readyState == 4)
   {
      dataDiv = document.getElementById('currentData');

      // If "OK"
      if (req.status == 200)
      {
         // Set current data text
         dataDiv.innerHTML = req.responseText;

         // Start new timer (1 min)
         timeoutID = setTimeout('reloadData()', 1000);
         // changed 60000 (1 min) to 1000 (1 sec)
      }
      else
      {
         // Flag error
         dataDiv.innerHTML = '<p>There was a problem retrieving data: ' + req.statusText + '</p>';
      }
   }
}

Answer 1

首先，现在几乎没有必要使用 XHR，当然也不需要使用旧的 ActiveX 后备方案。 Fetch API是 well-supported .

接下来，如果您希望通过脚本访问文件数据，您将需要运行某种形式的 Web 服务器来提供该文件数据。您无法从客户端打开服务器上的任意路径。服务器选择发送哪些数据来响应请求。

url = '/home/myUsername/liveData?' + now.getTime()

我假设您正在查询字符串上执行 getTime() 操作以进行缓存清除。别打扰。使用正确的Cache-Control而是使用标题。

最后，如果您可以实现适当的服务器，请抛弃所有这些并使用 EventSource API/Server-Sent Events 。这样，服务器可以在发生更改时立即通知您，通过您可以实现的非常简单的 API。