Pull to refresh

Apollo Link. Настраиваем клиент GraphQL «под себя»

Reading time 4 min
Views 5.7K
Original author: Evans Hauser

Сетевой уровень в Apollo Client и его отдельное использование


Возможно, вы встречали библиотеку, которая отвечает вашим потребностям, но не решает пару специфичных задач. И хотя эти задачи не относятся к основным функциям, но являются важной частью приложения. Нечто похожее бывает в современных клиентах GraphQL на сетевом уровне. В ответ на подобные вызовы мы создали библиотеку Apollo Link. Она дает каркас для управления ходом запросов GraphQL и для обработки результатов.


Чтобы ускорить разработку, стандартные модули Apollo Link реализуют основные функции сетевых стеков GraphQL от обычных HTTP-запросов до подписки на изменения через веб-сокеты и управления ходом запросов, включая повторную и пакетную отправку, фильтрацию дублирующихся запросов, синхронный периодический опрос ресурсов.


Примечание переводчика – В оригинальной статье сетевые модули называется словом Link. Это отражает сущность Apollo Link как компоновщика, соединяющего модули в цепочку. Однако дословный перевод Link искажает смысл, поэтому далее в статье модули называются коннекторами.


Чтобы создать клиент GraphQL с заданными свойствами, коннекторы Apollo Link соединяют с пользовательскими коннекторами в нужной последовательности. Добавленный в цепочку коннектор влияет на ход выполнения запроса, например обеспечивает повторную отправку. Результирующий коннектор может возвращать ExecutionResult (данные + ошибки). Это могут быть, например, подменные данные для тестирования, локальное состояние приложения или, чаще всего, результат запроса к серверу GraphQL.


image
Рис. HTTP-коннектор.


Чтобы поддержать различные требования приложений, каждый ответ GraphQL представлен объектом Observable. Обсерверы можно подписывать на события next, error, complete и запускать обработчики событий с помощью одноименных методов. Метод next можно вызвать любое количество раз прежде чем сработает келбек error или complete. Такая структура келбеков прекрасно подходит для работы с текущими и планируемыми результатами GraphQL, включая запросы, мутации, подписки и даже «живые» запросы.



В этой статье мы шаг за шагом создадим клиент GraphQL с Apollo Link. Результаты будут показываться в GraphiQL.


Основная задача всех GraphQL-клиентов – получать GraphQL-результаты. Поэтому начнем с создания коннектора, который делает HTTP-запросы. Он станет полезным примером для других коннекторов транспортного уровня, например для использования конечных точек Firebase, XHR, REST и других конечных точек GraphQL. Все коннекторы наследуют от базового класса, который содержит методы для соединения коннекторов и нужен для реализации метода request.


Посмотрите реализацию в песочнице на CodeSandbox



Следующая задача после создания транспортного коннектора – объединить коннекторы в поток обработки запроса. Для этого создадим еще коннектор, который перехватывает ошибки и представляет их в виде результирующих данные GraphQL, и другой коннектор – для логирования операций и результатов. Первым будет применяться логирующий коннектор, затем перехватывающий ошибки и наконец HTTP-коннектор будет выполнять запрос.


image
Рис. Последовательность применения коннекторов.


Чтобы цепочка заработала, логирующий и перехватывающий коннекторы должны иметь доступ к следующему за ними коннектору. Для этого у метода request есть аргумент forward. Это функция, которая при вызове передает объект-операцию следующему коннектору и возвращает его обсервер. В конце примера коннекторы собираются в цепочку с помощью статического метода from из Apollo Link.


Посмотрите пример этой цепочки в песочнице на CodeSandbox


Изменение отдельных запросов GraphQL


Здорово! Теперь созданный GraphQL-клиент управляет ходом запросов и ответов. А что если для запросов и мутаций нужно разное поведение? В следующем примере используются другие конечные точки для мутаций, также ошибки перехватываются только при запросе данных и логируется вся сетевая активность.


Дополнительно к этому можно выборочно изменять операцию не меняя транспорт, например добавлять переменные запроса, если операция имеет определенное имя. С помощью метода split Apollo Link позволяет выполнять те или иные части цепочки в зависимости от параметров операции.


Посмотрите пример в песочнице на CodeSandbox


Создайте свой клиент GraphQL


Отлично! Теперь можно создать полностью настраиваемый клиент GraphQL, у которого логика выполнения и получение данных зависят от конкретного запроса. Apollo Link предлагает множество готовых коннекторов, которые можно комбинировать и расширять вашими собственными коннекторами для достижения нужного поведения. Готовые коннекторы можно найти в репозитории Apollo Link.


Экосистема Apollo Link постоянно развивается благодаря сообществу разработчиков. Если вы хотите поучаствовать в разработке или обсудить механизм настройки клиента GraphQL, пожалуйста создайте соответствующий запрос – issue или pull request. Если у вас есть предложения для сотрудничества, подключитесь к Apollo Slack и отправьте мне (evans) личное сообщение!


В скором времени ждите статьи о взаимодействии между коннекторами с помощью поля context в операции GraphQL, о имеющих и не имеющих состояние коннекторах, о распространении конфигурации коннектора, о безопасном добавлении типа и другие!


Благодарю Sashko Stubailo, James Baxley III и Jonas Helfer за исчерпывающие поясненияо процессе разработки Apollo Link и за непрекращающуюся поддержку автора.


Перевод статьи Apollo Link: Creating your custom GraphQL client.
Автор оригинала Evans Hauser

Tags:
Hubs:
+4
Comments 0
Comments Leave a comment

Articles