如何每 n 分钟使用数据更新一次 Web 应用程序

How to update web application with data every n minutes

本文关键字：一次 应用程序 Web 更新 何每 分钟 数据      更新时间：2023-09-26

我想创建一个显示来自公共 API 的数据的 Web 应用程序。 我将使用 d3(一个 JavaScript 数据可视化库(。 我想每十分钟从 api 检索一次数据，并更新我的页面(比如说是流量或其他什么(。 我没有构建很多 Web 应用程序，如何获取更新？

客户端的js是否应该使用计时器从我的应用程序的服务器端请求更新(也许应用程序是用Rails或node.js编写的(。 然后服务器进行 api 调用并异步发送响应？ 这叫套接字吗？ 我读过HTML5提供套接字。

或者，也许是 AJAX 请求？

或者，我的应用程序的服务器端是否创建一个计时器，进行 api 调用，然后将更新"推送"到视图。 这对我来说似乎是错误的，此应用程序中可能还有其他视图，并且服务器不必跟踪哪个视图处于活动状态。

这种类型的 Web 应用程序是否有标准模式？非常感谢任何示例或教程。

AJAX 请求 (XMLHttpRequest( 可能是要走的路。

我这里有一个非常简单的XMLHttpRequest(以Java作为后端(的例子：https://stackoverflow.com/a/18028943/1468130

您可以重新创建后端以接收任何其他服务器端语言的 HTTP GET 请求。只需回显您检索到的任何数据，xmlhttp.onload()就会捕获它。

根据数据的复杂程度，您可能需要为所选的服务器端语言查找 JSON 库，并将数据序列化为 JSON，然后再将其回显到 JS。然后，您可以使用 JavaScript 的 JSON.parse() 方法将服务器数据转换为客户端脚本可以轻松使用的对象。

如果你使用的是jQuery，它处理AJAX非常顺利，使用$.ajax()可能比普通的XMLHttpRequest更容易。

http://api.jquery.com/jQuery.ajax/(本页中都有示例，主要集中在底部。

这真的让我很恼火，这么多的AJAX教程是多么复杂。至少使用jQuery，这很容易。

基本上，你只需要向脚本请求一些东西(发起请求，发送 url 参数(，然后等待脚本给你一些东西(触发你的onload()或jqxhr.done()函数，为这些函数提供data参数(。

对于您的其他问题：

  • 使用 JavaScript 的 setTimeout() 或setInterval()每 600000 毫秒发起一个 AJAX 请求。在请求的onload回调中，处理数据并相应地更新页面。
  • 响应将是异步的。
  • 这不是套接字。
  • 在这种情况下，"推动"可能不是要走的路。

如果我理解正确并且这个 API 是外部的，那么你的问题可以分为两个单独的子问题：

1( 更新服务器上的数据。服务器应每 N 分钟下载一次数据。因此，它不应连接到客户的 AJAX 调用。如果两个客户同时来到网站，你的服务器会做两个API调用，有什么不对的。

实际上，您应该在服务器上创建一个 CRON 作业，该作业将调用 API 并将其结果存储在服务器上。在这种情况下，您的服务器将始终一次进行一次调用，并缓存相当新的信息。

2( 在客户端更新数据。如果客户浏览器上的数据应该在不刷新页面的情况下更新，那么你应该使用某种 Ajax。它可以每 X 分钟向您的服务器发出一次请求，以获取新数据或使用所谓的长轮询。

我认为实现实时 Web 应用程序的最有效方法是使用 Web 套接字从服务器推送更改，而不是从客户端轮询。这样，一旦服务器通知有新数据可用，用户就可以立即看到更改。您可以在类似的帖子中阅读更多内容。

我尝试使用名为 socket.io 的nodejs包来制作实时虚拟教室。它对我来说效果很好。

相关文章：