GraphQL-клиент для браузера

GraphQL-клиент PolyApiIDE работает как расширение Chrome, Edge и Firefox: схема подтягивается через introspection, токены и адреса берутся из окружений, десктопное приложение ставить не нужно.

GraphQL поверх HTTP — это один POST на эндпоинт вида /graphql с телом {"query": "...", "variables": {...}} и заголовком Content-Type: application/json. Отправить такой запрос можно и обычным REST-клиентом, но тогда схема, переменные операции и повторяемость остаются на вас.

В PolyApiIDE под GraphQL выделен отдельный тип пространства: схема, переменные, коллекции и история ответов живут рядом с остальными протоколами проекта.

Что такое GraphQL-пространство

Тип протокола в PolyApiIDE задаётся на пространстве или на отдельном запросе. В GraphQL-пространстве адрес один на всю схему, а меняется не путь, а текст операции: запросы, мутации, фрагменты. Поэтому коллекция GraphQL выглядит иначе, чем REST-коллекция — это набор операций к одному эндпоинту, а не дерево URL.

Схема нужна, чтобы не держать в голове имена полей и типы аргументов. Её можно получить двумя способами: запросить у сервера через introspection или импортировать файл SDL. Оба варианта доступны на бесплатном тарифе — импорт GraphQL SDL и introspection входит в Free наряду с OpenAPI, WSDL, .proto и AsyncAPI.

Остальное работает так же, как в REST-пространстве: окружения, иерархия переменных, авторизация, скрипты до и после запроса, QA-проверки. Данные коллекций по умолчанию лежат локально в браузере, в облако что-либо уходит только по вашей команде — экспортом, патчем или снапшотом.

Как отправить GraphQL-запрос

1. Создайте GraphQL-пространство

Выберите тип протокола на пространстве — тогда все запросы внутри наследуют его, — либо переключите тип у конкретного запроса. В адрес впишите эндпоинт, обычно это единственный URL вида https://api.example.com/graphql.

2. Подтяните схему

Доступны два пути:

  • introspection — расширение спрашивает схему у самого эндпоинта;
  • импорт SDL-файла (.graphql, .graphqls) — если introspection на сервере отключён.

Второй вариант нужен чаще, чем кажется: закрывать introspection в продакшене — обычная практика.

3. Опишите операцию и переменные

Текст операции уходит в поле query, аргументы — в variables. Именованные операции и фрагменты пишутся как обычно:

query User($id: ID!) {
  user(id: $id) {
    id
    name
    roles { code }
  }
}

4. Вынесите токен и адрес в окружение

Держите эндпоинт и токен в окружении, а в запросе ссылайтесь на них через {{var}} или {var} — подстановка работает в URL, заголовках и теле. Иерархия значений: запрос → коллекция → пространство → окружение, причём пустые значения не применяются и не затирают нижний уровень.

5. Отправьте и прочитайте ответ целиком

Ответ открывается деревом JSON. Важная деталь GraphQL: код 200 ещё не значит успех — ошибки валидации и резолверов приходят в массиве errors при статусе 200. Чтобы это не ловить глазами, навесьте на запрос QA-проверки по JSON path и вхождению подстроки.

Что есть в GraphQL-пространстве

  • Introspection схемы и импорт SDL-файла — на бесплатном тарифе
  • Переменные операции в блоке variables, именованные операции и фрагменты
  • Подстановка {{var}} и {var} в URL, заголовках и теле запроса
  • Коллекции, папки и пространства — отдельно под dev, test и прод
  • Pre-request и after-response скрипты
  • QA-проверки на уровне запроса, сценарии и PDF-отчёты
  • Рядом в том же проекте: REST, WebSocket, SOAP, SSE и gRPC через JSON-transcoding
  • Коллекции хранятся локально в браузере, выгрузка в облако — только вручную
  • Интерфейс на русском и английском

Чем отличается от GraphQL Playground и Apollo Sandbox

СценарийPolyApiIDEPlayground / Sandbox
Запуск Расширение браузера, аккаунт для отправки запросов не нужен Страница, которую отдаёт сам сервис, или внешний сайт
Схема Introspection или импорт SDL-файла Introspection эндпоинта
Где живут запросы Коллекции и пространства в локальном хранилище браузера Как правило, вкладка и её локальное хранилище
Переменные Иерархия запрос → коллекция → пространство → окружение Один набор переменных на вкладку
Другие протоколы рядом REST, WebSocket, SOAP, SSE, gRPC через JSON-transcoding Только GraphQL

Playground и Sandbox хороши, когда эндпоинт один и схема открыта. Коллекции, несколько контуров и повторяемые проверки — уже задача API-клиента.

Частые вопросы

Нужен ли аккаунт, чтобы отправить GraphQL-запрос?

Нет. Тариф Free работает сразу после установки расширения, регистрация на сайте для отправки запросов не требуется. Аккаунт нужен только для облачных функций и для ключа платного тарифа.

Что делать, если introspection на сервере отключён?

Импортировать схему файлом: поддерживается GraphQL SDL, и импорт входит в бесплатный тариф. Так же можно работать и вообще без схемы — тело запроса вы пишете сами, расширение просто отправит его на эндпоинт.

Поддерживаются ли subscriptions?

Отдельного режима подписок нет. Двусторонний канал можно открыть вручную в WebSocket-пространстве и самостоятельно отправлять кадры, но автоматической сборки subscription-операций по схеме расширение не делает. Говорим прямо, чтобы вы не тратили время на поиск этой кнопки.

Почему пришёл статус 200, а данных в ответе нет?

Это штатное поведение GraphQL поверх HTTP: ошибки схемы и резолверов отдаются в массиве errors, а транспортный код остаётся 200. Смотрите тело ответа, а не только статус — и добавьте QA-проверку по JSON path, чтобы такие случаи падали сами.

Можно ли подставлять переменные внутрь текста операции?

Да, {{var}} и {var} раскрываются и в теле, то есть и в query, и в variables. Для разных контуров достаточно переключить окружение, сами запросы править не нужно.