Что именно мы здесь делаем?
Мы собираемся создать схему GraphQL, которая будет переносить вызовы в существующий REST API. Эта схема будет получать и разрешать запросы GraphQL на стороне клиента.
Основное преимущество этого заключается в том, что вместо нескольких конечных точек для доступа к вашим данным вы можете сосредоточиться на одной и позволить запросу определять, что возвращается.
Наша схема GraphQL будет действовать как слой фасада. Фасад — это просто причудливый способ сказать: «Он упрощает наш существующий REST API».
Я подготовил шаблонное репо для справки Здесь.
Что такое REST API?
RESTful API — это архитектурный стиль интерфейса прикладной программы (API), который использует HTTP-запросы для доступа и использования данных. Эти данные можно использовать для типов данных GET, PUT, POST и DELETE, которые относятся к операциям чтения, обновления, создания и удаления ресурсов.
Отметьте здесь для отличного объяснения.
Что такое GraphQL?
GraphQL — это язык запросов для вашего API и среда выполнения на стороне сервера для выполнения запросов с использованием системы типов, которую вы определяете для своих данных. GraphQL не привязан к какой-либо конкретной базе данных или механизму хранения, а вместо этого поддерживается вашим существующим кодом и данными.
Отметьте здесь для отличного объяснения.
Настройка бессерверного проекта
Шаблон для этого проекта был создан с помощью Serverless.
Руководство по настройке смотрите здесь.
Если вы просто хотите получить локально настроенный экземпляр GraphQL, вы можете пропустить этап без сервера и запустить проект с помощью узлового сервера,это будет запустите все, используя Node, Express и GraphQL.
Наш существующий REST API
Чтобы не загрязнять этот пост ненужными сложностями, мы будем использовать статический файл JSON для имитации нашего ответа REST API.
В любое время, когда будет выполняться вызов конечной точки в преобразователе, мы просто вернем соответствующий ответ JSON.
Резолверы, схемы и типы
Для запросов и мутаций в GraphQL вам необходимо реализовать Resolvers, Schema & Types, вот краткое описание каждого из них.
Здесь — отличный источник информации о GraphQL.
Резолверы:
Преобразователь — это набор функций, которые генерируют ответ на запрос GraphQL. Проще говоря, преобразователь действует как обработчик запросов GraphQL.
Схема:
Схема GraphQL лежит в основе любой реализации сервера GraphQL. Он описывает функциональные возможности, доступные клиентским приложениям, которые подключаются к нему.
Типы:
GraphQL — строго типизированный язык. Система типов определяет различные типы данных, которые можно использовать в приложении GraphQL. Система типов помогает определить схему, которая представляет собой контракт между клиентом и сервером.
Что такое запрос GraphQL?
Операция GraphQL может быть операцией чтения или записи. Запрос GraphQL используется для чтения или выборки значений, в то время как мутация используется для записи или публикации значений. В любом случае операция представляет собой простую строку, которую сервер GraphQL может проанализировать и отправить в ответ данные в определенном формате. Популярным форматом ответа, который обычно используется для мобильных и веб-приложений, является JSON.
Что такое мутация GraphQL?
Запросы на изменение изменяют данные в хранилище данных и возвращают значение. Его можно использовать для вставки, обновления или удаления данных. Мутации определяются как часть схемы.
Что такое GrapiQL?
GraphiQL — это GraphQL интегрированная среда разработки (IDE), которая позволяет нам выполнять все наши запросы и мутации и проверять, все ли работает должным образом.
Чтобы получить доступ к GraphiQL для этого проекта, вам просто нужно перейти в корень /.
Оказавшись там, вы увидите интерфейс, левая сторона предназначена для ввода вашего запроса/мутации, правая сторона – это место, где будут отображаться результаты/ошибки.
В ридми шаблона я дал вам примеры запросов для использования в GraphiQL.
Пример запроса:
{ posts{ _id, title, subtitle } }
Пример мутации:
mutation { addPost( title: "Brand New Post", subtitle: "This is super interesting", text: "The body for the new blog post" ) { title subtitle text } }
Собираем все вместе
Мы создадим проект, который можно будет запускать локально на сервере Node или из экземпляра AWS Lamda. 🚀
Прежде чем продолжить, убедитесь, что у вас установлен Node.
Я создал стандартный репозиторий, чтобы сопровождать этот пост Здесь.
Чтобы запустить шаблон, просто выполните следующие 3 шага:
- клонировать репозиторий
- установить зависимости (yarn или npm install)
- запустить: узел сервера
Как только он заработает, перейдите по URL-адресу, и вам будет представлен GraphiQL.
Вот небольшое объяснение основных частей этого проекта.
Настройка узла:
Чтобы запустить наш экземпляр Node, нам нужны всего два файла:
сервер.js
См. Здесь. Этот файл является базовым для запуска нашего приложения Node.
app.js
См. Здесь. Это настраивает наш экспресс-сервер и нашу конечную точку GraphQL.
Интересно отметить, что в приведенном ниже блоке graphiql: true позволяет нам использовать инструмент GraphiQL, упомянутый выше.
app.use( ‘/’, graphqlHTTP({ graphiql: true, schema: GraphQLSchema }));
Настройка Lambda:
Если вы заинтересованы только в том, чтобы запустить это в Node, вы можете пропустить это.
Однако, если вы хотите, чтобы это работало на AWS, вам потребуется создать файл serverless.yml и соответствующую функцию-обработчик.
Serverless.yml
См. здесь. Этот файл настраивает все, что вам нужно для AWS API Gateway, позволяя конечным точкам использовать GraphiQL в AWS.
Это блок, который обрабатывает создание маршрутов. Самое замечательное в этом то, что он избавляет вас от необходимости входить в систему и вручную создавать маршруты.
functions: getPosts: handler: lambda.handler events: - http: path: posts method: get cors: true - http: path: posts method: post cors: true
лямбда.js
См. Здесь. Функция обработчика будет запущена при вызове маршрутов нашего шлюза API.
Мы используем пакет npm aws-serverless-express. Это позволяет нам запускать бессерверные приложения и REST API, используя нашу существующую среду приложений Node.js поверх AWS Lambda и Amazon API Gateway. .
Настройка GraphQL:
Все необходимое для настройки схемы GraphQL можно найти в этом каталоге.
У нас есть наши запросы, преобразователи, типы и мутации, разделенные на отдельные каталоги.
схема.js
См. Здесь. Наш js-файл схемы является сердцем нашей настройки GraphQL, здесь мы указываем наши запросы и мутации, которые мы настроили.
Наш запрос (см. здесь) связан с нашим распознавателем (см. здесь). Здесь вы должны сделать вызов API для извлечения данных, в этом примере я возвращаю статический JSON. объект для имитации данных, возвращаемых из API.
Вы заметите, что в нашем Query мы ссылаемся на наш тип (см. здесь). Это гарантирует, что данные, которые мы возвращаем, являются именно теми, которые мы ожидаем, позволяя GraphQL работать. его магия и работа, как и ожидалось.
Наша мутация (см. здесь) перечисляет полезную нагрузку, которую она ожидает получить, а также типы ожидаемых данных. Если передается достаточная полезная нагрузка, она попадет в функцию разрешения.
Функция разрешения — это то, где вы должны отправить полезную нагрузку в свой API для вставки или обновления, а затем вернуть измененный ответ. В этом примере нам просто вернут отправленные нами аргументы.
Подведение итогов:
Я надеюсь, что это помогло пролить свет на то, как реализовать GraphQL.
Как было сказано выше, клонируйте шаблон и приступайте к работе.