Как использовать Apollo с Deno

Apollo Server — это сервер GraphQL, который можно настроить за несколько минут и использовать с существующим источником данных (или REST API). Затем к нему можно подключить любой GraphQL-клиент для получения данных и использования преимуществ GraphQL, таких как проверка типов и эффективное извлечение данных.

Мы собираемся запустить простой сервер Apollo, который позволит нам запросить некоторые локальные данные. Нам понадобятся всего три файла:

1. schema.ts для настройки нашей модели данных
2. resolvers.ts для настройки того, как мы будем заполнять поля данных в нашей схеме
3. Наш main.ts для запуска сервера

Начнём с их создания:

touch schema.ts resolvers.ts main.ts

Давайте рассмотрим настройку каждого файла.

Посмотреть исходный код здесь.

schema.ts

Наш schema.ts файл описывает наши данные. В данном случае наши данные — это список динозавров. Мы хотим, чтобы пользователи могли получить имя и краткое описание каждого динозавра. На языке GraphQL это означает, что Dinosaur — это наш тип, а name и description — это наши поля. Мы также можем определить тип данных для каждого поля. В данном случае оба — строки.

Здесь мы также описываем запросы, которые мы разрешаем для наших данных, используя специальный тип Query в GraphQL. У нас есть два запроса:

• dinosaurs , который получает список всех динозавров
• dinosaur , который принимает name динозавра в качестве аргумента и возвращает информацию об этом типе динозавра.

Мы собираемся экспортировать всё это в наших typeDefs типах определений, переменных:

export const typeDefs = `
  type Dinosaur {
    name: String
    description: String
  }

  type Query {
    dinosaurs: [Dinosaur]
		dinosaur(name: String): Dinosaur
  }
`;

Если мы захотели бы записывать данные, здесь мы бы описали Mutation для этого. Mutations — это способ записи данных с помощью GraphQL. Поскольку мы используем статический набор данных, мы ничего не будем записывать.

resolvers.ts

Решатель отвечает за заполнение данных для каждого запроса. Здесь у нас есть наш список динозавров, и всё, что делает решатель, — это либо а) передаёт весь этот список клиенту, если пользователь запросил dinosaurs запрос, либо передаёт только один, если пользователь запросил dinosaur запрос.

const dinosaurs = [
  {
    name: "Aardonyx",
    description: "An early stage in the evolution of sauropods.",
  },
  {
    name: "Abelisaurus",
    description: '"Abel\'s lizard" has been reconstructed from a single skull.',
  },
];

export const resolvers = {
  Query: {
    dinosaurs: () => dinosaurs,
    dinosaur: (_: any, args: any) => {
      return dinosaurs.find((dinosaur) => dinosaur.name === args.name);
    },
  },
};

В последнем случае мы передаём аргументы от клиента в функцию для сопоставления имени с именем в нашем наборе данных.

main.ts

В нашем main.ts мы собираемся импортировать ApolloServer , а также graphql и наши typeDefs из схемы и наших решателей:

import { ApolloServer } from "npm:@apollo/server@^4.1";
import { startStandaloneServer } from "npm:@apollo/server@4.1/standalone";
import { graphql } from "npm:graphql@16.6";
import { typeDefs } from "./schema.ts";
import { resolvers } from "./resolvers.ts";

const server = new ApolloServer({
  typeDefs,
  resolvers,
});

const { url } = await startStandaloneServer(server, {
  listen: { port: 8000 },
});

console.log(`Server running on: ${url}`);

Мы передаём наши typeDefs и resolvers в ApolloServer для запуска нового сервера. Наконец, startStandaloneServer — это вспомогательная функция для быстрого запуска сервера.

Запуск сервера

Всё, что осталось сделать, — запустить сервер:

deno run --allow-net --allow-read --allow-env main.ts

Вы должны увидеть Server running on: 127.0.0.1:8000 в вашем терминале. Если вы перейдёте по этому адресу, вы увидите песочницу Apollo, где мы можем ввести наш dinosaurs запрос:

query {
  dinosaurs {
    name
    description
  }
}

Это вернёт наш набор данных:

{
  "data": {
    "dinosaurs": [
      {
        "name": "Aardonyx",
        "description": "An early stage in the evolution of sauropods."
      },
      {
        "name": "Abelisaurus",
        "description": "\"Abel's lizard\" has been reconstructed from a single skull."
      }
    ]
  }
}

Или если мы хотим только одного dinosaur:

query {
  dinosaur(name:"Aardonyx") {
    name
    description
  }
}

Что возвращает:

{
  "data": {
    "dinosaur": {
      "name": "Aardonyx",
      "description": "An early stage in the evolution of sauropods."
    }
  }
}

Отлично!

Узнайте больше о работе с Apollo и GraphQL в их руководствах.