Question

Gatsby和Netlify的新手，但我有一个问题，我找不到其他地方的答案，可能是因为这是错误的方法。

我正在为客户端构建一个气象应用程序，该应用程序需要显示过去一天/一周/月的数据的动画视图，这需要以不同的分辨率向天气API多次请求数据，然后将其插入到使用setInterval进行可视化。

不是在客户端上发出所有这些请求，而是发生在我身上，我可以通过计划的构建在构建时获取所有数据，并每天使用此更新的数据静态地为页面提供服务，这可以节省API并减少费用。

问题是gatsby假定您要使用获取的数据生成html并使用createPages，但在这里我只想将数据作为json存储在js包中以在客户端上呈现。

是否有一种方法可以将获取和格式化的构建时间放入json或类似文件中，并静态地提供给客户端渲染？

Answer 1

您用jamstack标签标记了这个问题，并且您的方法完全适合这种方法。

是否有一种方法可以将获取的构建时间和格式化的数据放入 json或类似名称，并静态地在客户端上呈现？

是的

构建显示天气数据的React代码。
构建您的天气数据json。
仅使用天气数据json中的变量。

简单的示例：

import data from "./data/weatherData.json"

const WeatherApp = () => {
  return (
    <Layout>
      <h1>{data.title}</h1>
      <div>{data.rain}</div>
      <div>{data.temperature}</div>
    </Layout>
  );
};

为了填充天气数据，您可以构建一个复杂的GraphQL查询，以完全按照所需的方式获取所有数据。

另一种方法是例如使用AWS lamba或类似的无服务器免费服务来构建自己的API，并以此来提供天气数据。这样，您就无需触发gatsby build。

使用gatsby和netlify进行构建时获取后在客户端上持久保留api数据

1 个答案: