Рубрики
Без рубрики

Нежное введение в интеграцию API GraphQL

Автор оригинала: Hugo Di Francesco.

GraphQL – отличная альтернатива для отдыха (или других конструкций HTTP API). Это быстрое введение в основные концепции вокруг потребляющий API GraphQL.

Чтобы увидеть некоторые примеры, которые потребляют API GraphQL:

Что такое graphql и какие проблемы это решают?

Graphql это «Язык запроса для вашего API» Отказ

На простом английском он делает клиент определить, что (вложенные) данные им нужны.

Если мы сравним это с Отдых Подходы:

  • «Чистый» подход для отдыха – возвращать идентификаторы (или ссылки на ресурсы) для любых ассоциаций (или вложенных ресурсов).
  • Менее чистый подход – расширить все вложенные материалы.

Первая ситуация приводит к тому, чтобы сделать много звонков для получения всех данных. Второе приводит к огромным полезным нагрузкам и медленному времени нагрузки.

В GraphQL клиентские состояния в запросе то, что он хочет расширен, переименован или все остальное в ответ.

Он имеет несколько хороших побочных эффектов, например, меньше необходимости версию вашу API, поскольку клиент определяет то, что он хочет, и GraphQL имеет способ уникальных полей.

Схема

Graphiql , «IDE в браузере для изучения графаQL». Доступен, навигации по конечной точке в вашем браузере. Можно генерировать схему с помощью CLI GraphQL (требуется узел + NPM 5+):

npx graphql-cli get-schema --endpoint $BASE_URL/api/graphql --no-all -o schema.graphql

Запрашивает

Концепции запроса GraphQL

Полей

Что мы хотели бы вернуть в запрос, посмотреть Документация GraphQL для «Поля» Отказ Запрос GraphQL для этого возвращает поля Имя , Фервет , MaxCP , Maxhp следующее:

{
  pokemon(name: "Pikachu") {
    name
    fleeRate
    maxCP
    maxHP
  }
}

Аргументы

Как мы собираемся отфильтровать данные запроса вниз, см. Документация GraphQL для «аргументов» Отказ Чтобы получить имена первых 10 покемонов, которые мы используем Покемоны (первые: 10) {поля} Чтобы увидеть вывод здесь :

{
  pokemons (first: 10) {
    name
    fleeRate
    maxCP
    maxHP
  }
}

Псевдонимы

Псевдонимы дают нам возможность переименовывать поля. (См. Документация GraphQL для «псевдонимов» ). Мы на самом деле собираемся использовать его для отображения полей карты в запросе, например. от верблюда до змеи:

{
  pokemon(name: "Pikachu") {
    evolution_requirements: evolutionRequirements {
      amount
      name
    }
  }
}

Запуск этого запроса ( здесь ) дает нам следующее, где EvolutionRequirements Это то, что мы псевдоним это.

{
  "data": {
    "pokemon": {
      "evolution_requirements": {
        "amount": 50,
        "name": "Pikachu candies"
      }
    }
  }
}

Фрагменты

Определение полей, которые будут расширены на типе. Это способ сохранить заправки сухих и вообще разделить определения поля, которые повторяются, повторно используются или глубоко вложены, см. Документация GraphQL для фрагментов Отказ Это будет означать, что вместо того, чтобы делать ( см. Запрос в действии здесь ):

{
  pokemon(name: "Pikachu") {
    weight {
      minimum
      maximum
    }
    height {
      minimum
      maximum
    }
  }
}

Например, мы можем запустить это ( Query здесь ):

{
  pokemon(name: "Pikachu") {
    weight {...FullPokemonDimensions}
    height {...FullPokemonDimensions}
  }
}
fragment FullPokemonDimensions on PokemonDimension {
  minimum
  maximum
}

Вывод эквивалентен:

{
  "data": {
    "pokemon": {
      "weight": {
        "minimum": "5.25kg",
        "maximum": "6.75kg"
      },
      "height": {
        "minimum": "0.35m",
        "maximum": "0.45m"
      }
    }
  }
}

Запуск запроса GraphQL

Запрос GraphQL можно запустить пост или получить, он состоит из:

Пост (рекомендуется)

  • Требуемые заголовки: Тип содержимого: приложение/JSON
  • Требуется параметр тела JSON: Запрос: {# Вставьте свой запрос}

RAW HTTP-запрос

POST / HTTP/1.1
Host: graphql-pokemon.now.sh
Content-Type: application/json
{
        "query": "{ pokemons(first: 10) { name } }"
}

скручивание

curl -X POST \
  https://graphql-pokemon.now.sh/ \
  -H 'Content-Type: application/json' \
  -d '{
        "query": "{ pokemons(first: 10) { name } }"
    }'

ПОЛУЧАТЬ

  • Требуемый запрос Paral: запрос

RAW HTTP-запрос

GET /?query={%20pokemons(first:%2010)%20{%20name%20}%20} HTTP/1.1
Host: graphql-pokemon.now.sh

скручивание

curl -X GET 'https://graphql-pokemon.now.sh/?query={%20pokemons%28first:%2010%29%20{%20name%20}%20}'

Запросы верхнего уровня

На 2 типа запросов на Graphql pokemon api

  • Первый X Pokemon: Получите все предметы (с любыми полями определены в запросе)
  • Одиночный покемон по названию: получите один элемент по его слизме (с помощью любых полей определены в запросе)
  • Одиночный покемон по ID: получите один элемент по его слизме (с помощью любых полей определены в запросе)

Первый х покемон

Запросы формы ( Увидеть его в действии в Graphiql ):

{
  pokemons(first: 5) {
    name
    # other fields
  }
}

Одиночный покемон по имени

Запросы формы ( Увидеть его в действии в Graphiql ):

{
  pokemon(name: "Pikachu") {
    name
    classification
    # other fields
  }
}

Одиночный покемон по ID

Запросы формы ( Увидеть его в действии в Graphiql ):

{
  pokemon(id: "UG9rZW1vbjowMjU=") {
    name
    classification
    # other fields
  }
}

Образец запросов

Получите какой-нибудь покемон, чтобы создать крепость/слабость/классификацию сопротивления

Запрос ( Увидеть его в Graphiql ):

{
  pokemons(first: 100) {
    name
    image
    maxHP
    types
    weaknesses
    resistant
  }
}

Получить покемонов и эволюцию расширены для физической статистики и атаки

Запрос ( Увидеть его в Graphiql ):

{
  pokemon(name: "Pikachu") {
    ...PokemonWithAttack
    ...FullPhysicalStats
    evolutions {
      ...FullPhysicalStats
      ...PokemonWithAttack
    }
  }
}
fragment PokemonWithAttack on Pokemon {
  name
  attacks {
    fast {
      name
      type
      damage
    }
    special {
      name
      type
      damage
    }
  }
}
fragment FullPhysicalStats on Pokemon {
  height { ...FullDimension }
  weight { ...FullDimension }
}
fragment FullDimension on PokemonDimension {
  minimum
  maximum
}

Получите выбранный покемон как названные поля с именами эволюции

Запрос ( Увидеть его в graphiql ).

Мы можем переименовать запросы верхнего уровня, используя псевдонимы. Это полезно, если мы хотим сделать следующее:

{
  pikachu: pokemon(name: "Pikachu") {
    ...FullPokemon
    evolutions {
      ...FullPokemon
    }
  }
  bulbasaur:pokemon(name: "Bulbasaur") {
    ...FullPokemon
    evolutions {
      ...FullPokemon
    }
  }
}
fragment FullPokemon on Pokemon {
  name
}

Если вы хотите узнать, как интегрироваться с API GraphQL:

– В Python см. Python GraphQl Client Запросы Пример Использование GQL – в JavaScript Браузер и узел, см. Код на прошлой неделе с Hugo Newsletter

Читать дальше моих статей на моем сайте, Код с Hugo Отказ

Читайте ещё по теме: