Question

我仍处于编程的早期阶段，我正在考虑创建一些在每x秒后执行API调用的内容，并使用新内容更新我的网站。

我的目标是使用FOR循环（.ejs页面）填充从API获得的内容的表。

现在，我希望在x秒后更新我的网页上的那些行和列（从FOR循环创建），而不是刷新整个页面。我怎样才能实现这一点（更新那些行和列）？

考虑股票市场网站，它只是更新股票价格，而不是整个页面。

感谢您的提前帮助

Answer 1

我希望将expressjs与node.js结合使用来构建您的网站。然后在你的html中使用ajax来完成其余的api调用更新。

Answer 2

解决此问题的最常用方法是将从其他API获取的数据存储在数据库中，然后创建一个端点，以JSON的形式提供该数据的最新版本。

然后在客户端，您定期向服务器发出请求以获取内容并更新页面的一部分以显示可用的最新数据。

这可以很简单：

// server side (if you use express)

app.get("/data", (req, res) => {
  database.getMostRecentEntry()
    .then(data => res.json(data))
    .catch(err => res.status(500).end());
});


// client side

function fetchMostRecentData() {
  fetch("/data")
    .then(response => response.json())
    .then(data => updateView(data))
    .catch(err => showError(err));
}

function updateView(data) {
  let container = document.getElementById("app");

  container.innerHTML = `
    <tr>
      <td>${data.name}</td>
      <td>${data.value}</td>
    </tr>
  `;
}

function showError(err) {
  console.error(err);
  alert("Something went wrong");
}

// call fetchMostRecentData once every 10s
setInterval(fetchMostRecentData, 10000);

现在，这不是一个非常强大的解决方案，并且存在一些相当严重的安全问题，但这是一个起点。

从这里开始，您应该考虑使用前端框架（而不是自己更新innerHTML）。您还可以查看使用websockets，而不是通过HTTP端点提供数据。

使用NodeJ

2 个答案: