Сохранение данных API на клиенте после выборки во время сборки с помощью gatsby и netlify - PullRequest
2 голосов
/ 08 октября 2019

Новичок в Gatsby и Netlify, но у меня есть вопрос, на который я не могу найти ответ в другом месте, возможно, из-за неправильного подхода.

Я создаю приложение погоды для клиента, который должен показатьанимированное представление данных за последний день / неделю / месяцы, которое требует выполнения нескольких запросов к API погоды для данных с разным разрешением и последующего подключения к визуализациям с помощью setInterval, по существу.

Вместо того, чтобы делать все этизапросы на клиент, мне пришло в голову, я мог получить все данные во время сборки с запланированной сборкой и обслуживать страницу статически с этими обновленными данными каждый день, что сэкономило бы удары по API и уменьшило бы затраты.

Проблема в том, что Гэтсби предполагает, что вы хотите создать html с извлеченными данными и использовать createPages, но здесь я просто хочу сохранить данные как json в комплекте js для рендеринга на клиенте.

Есть ли способ поместитьвремя сборки извлекается и форматируется данные в JSON или аналогичный и обслуживатьТатически для рендеринга на клиенте?

1 Ответ

2 голосов
/ 11 октября 2019

Вы пометили этот вопрос тегом jamstack, и ваш подход точно соответствует этому подходу.

Есть ли способ поместить извлеченные и отформатированные данные времени сборки в json или аналогичные файлы и служить статически для рендеринга на клиенте?

Да.

  1. Создайте код React, который показывает данные о погоде.
  2. Создайте данные о погоде json.
  3. Используйте только переменные из данных о погоде 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, который выбирает все данные именно так, как вам нужно.

Другим подходом может быть создание собственного API, например, с AWS lamba или аналогичным безсерверным бесплатным сервисом, и предоставление данных о погоде с этим. Таким образом, вам не нужно запускать gatsby build.

...