GraphQL — это язык запросов для API и среды выполнения для выполнения этих запросов с вашими существующими данными. GraphQL предоставляет полное и понятное описание данных в вашем API, дает клиентам возможность запрашивать именно то, что им нужно, и не более того, упрощает развитие API с течением времени и предоставляет мощные инструменты разработчика. GraphQL можно использовать с любой внутренней структурой или языком программирования.
Пример учебного пособия GraphQL для начинающих
Сначала создайте каталог проекта и перейдите в этот каталог. В качестве менеджера пакетов я использую Yarn, поэтому, если вы не установили его, вы можете получить его через npm. Если вы не установили Node.js, сначала установите, а затем вы сможете загрузить любые пакеты npm.
mkdir graphqltutorialcd graphqltutorial
Хорошо, теперь установите GraphQL с помощью следующей команды.
yarn add graphql
Откройте эту папку внутри Visual Studio Code редактор, используя следующую команду.
code.
Если вы используете другой редактор, просто откройте папку нашего проекта внутри этого редактора.
Следующим шагом будет создание веб-сервера Node.js. Итак, создайте файл server.js в корне проекта.
//server.jsconst {graphql, buildSchema} = require (' graphql ');//Создаем схему, используя схему GraphQL languageconst schema = buildSchema (`type Query {hello: String}`);//Корень предоставляет функцию преобразователя для каждой конечной точки API const root = {hello: () => 'Привет! Добро пожаловать в GraphQL '};//Запускаем запрос GraphQL' {hello} 'и распечатываем responsegraphql (schema,' {hello} ', root) .then ((response) => {console.log (response);} );
Хорошо, теперь сохраните файл, перейдите в терминал и запустите сервер узла.
node server
Вы будете см. ответ в журнале.
Служба GraphQL создается путем определения типов и полей этих типов, а затем предоставления функций для каждого поля каждого типа. В приведенном выше примере мы определили String hello. Затем мы создали функцию распознавателя, которая возвращает свое значение « Hello! Добро пожаловать в GraphQL “.
Настройка сервера GraphQL с помощью Express
Хорошо, теперь установите следующие пакеты с помощью Yarn.
yarn add express-graphql nodemon
Хорошо, теперь импортируйте экспресс-модуль внутри server.js
//server.jsconst express = require ('express'); const app = express (); app.listen (4000, () => {console.log ( 'Сервер работает');});
Следующим шагом является создание схемы. Итак, внутри корневой папки создайте один файл с именем schema.js.
После этого сначала мы импортируем некоторые типы данных из модуля GraphQL. Итак, давайте сделаем это внутри файла schema.js .
//schema.jsconst {GraphQLObjectType, GraphQLString, GraphQLSchema, GraphQLInt} = require ('graphql') ;
Давайте создадим образец данных внутри файла schema.js , потому что нам нужны образцы данных для запроса. Чтобы мы могли получить результат.
//schema.jsconst employee = [{id: 1, name: 'Krunal', email: 'krunal@appdividend.com'}, {id: 2, имя: 'Ankit', электронная почта: 'ankit@appdividend.com'}, {id: 3, имя: 'Rushabh', электронная почта: 'rushabh@appdividend.com'}];
Теперь нам нужно определить EmployeeType. Нам нужно запросить массив сотрудников. Итак, сначала мы определяем схему для EmployeeType.
//schema.jsconst EmployeeType = new GraphQLObjectType ({name: 'Employee', fields: () => ({id: {type: GraphQLInt }, name: {type: GraphQLString}, email: {type: GraphQLString}})});
Почти все типы GraphQL , которые вы определяете, будут типы объектов. Типы объектов имеют имя , но самое главное описывают их поля . Итак, нам нужно указать поля для EmployeeType.
Итак, мы определили три поля для нашей цели: id, name и email. Итак, это просто означает, что мы можем запрашивать данные по этим трем полям.
Либо мы можем получить данные всех трех полей, либо мы можем применить некоторые условия для получения требуемых данных. Это структура данных нашего запроса. Поэтому нам нужно определить его в объекте EmployeeType.
Определить RootQuery
Давайте определим RootQuery.
//schema.jsconst RootQuery = new GraphQLObjectType ({name: 'RootQueryType', поля: {employee: {type: EmployeeType, args: {id: {type: GraphQLInt}}, resolve (parentValue, args) {for (let i = 0; i Он также содержит те же поля name и . Здесь поля имеют тип EmployeeType , который мы определили ранее.
Мы будем запрашивать данные на основе переданного от пользователя идентификатора. Таким образом, функция сотрудника получает один аргумент - id.
Позже в разрешении мы поставили условие, что если переданный идентификатор совпадает с уже определенным массивом, мы просто возвращаем этого сотрудника.
Итак, теперь мы определили схему, а также написали логику, которая возвращает точные данные, которые мы запросили.
Теперь полный код этого файла schema.js выглядит следующим образом.
//schema. jsconst {GraphQLObjectType, GraphQLString, GraphQLSchema, GraphQLInt} = require ('graphql'); const employee = [{id: 1, name: 'Krunal', электронная почта: 'krunal@appdividend.com'}, {id: 2, name : 'Ankit', электронная почта: 'ankit@appdividend.com'}, {id: 3, name: 'Rushabh', электронная почта: 'rushabh@appdividend.com'}]; const EmployeeType = new GraphQLObjectType ({name: 'Сотрудник ', fields: () => ({id: {type: GraphQLInt}, name: {type: GraphQLString}, email: {type: GraphQLString}})}); const RootQuery = new GraphQLObjectType ({name:' RootQueryType ' , поля: {employee: {type: EmployeeType, args: {id: {type: GraphQLInt}}, resolve (parentValue, args) {for (let i = 0; i Импортируйте schema.js внутрь server.js.
Итак, наш последний файл server.js выглядит так.
//server.jsconst express = require ('express'); const app = express (); const expressGraphQL = require ('express-graphql'); const schema = require ('./schema'); app.use ('/graphql', expressGraphQL ({schema: schema, graphiql: true}) ); app.listen (4000, () => {console.log ('Сервер GraphQL запущен');});
Теперь, если запустить сервер node.js следующей командой .
nodemon server
Если вы получаете сообщение об ошибке, пожалуйста, установите nodemon глобально на свой компьютер, используя следующую команду.
yarn global add nodemon
Это решит проблему и снова вызовет команду. Это покажет нам, что GraphQL Server работает на консоли. Переключитесь в браузер и нажмите следующий URL.
http://localhost: 4000/graphql
Конечно, вы видите некоторые комментарии на экране, но в начале этого интерфейса вы найдете комментарии , Я удалил, потому что нам это не нужно. Вместо этого удалите все комментарии, и там нам нужно написать запрос, описывающий, сколько данных нам нужно.
Напишите следующий запрос на левой боковой панели.
{employee (id: 1) {name email}}
Это означает, что мы получаем только имя и адрес электронной почты сотрудника, который имеет id = 1. Теперь нажмите кнопку воспроизведения или cmd + return, чтобы увидеть выборку данных.
{"data": {"employee": {"name": "Krunal", " email ":" krunal@appdividend.com "}}}
Вы можете видеть, что описанные нами данные запроса и данные выборки почти одинаковы, возвращаемые данные находятся в формате JSON с data .
Итак, это наш первый успешный запрос к серверу GraphQL. Как видите, мы получаем только те данные, которые мы описали. Вот и все для этого Пример учебника GraphQL для начинающих.
