GraphQL 変換 API 開発

はじめに

最新の Web アプリケーションでは、効率的かつ柔軟なデータの取得が求められます。 API 開発に革命をもたらすクエリ言語である GraphQL は、このニーズに応えます。 2015 年に Facebook がデビューして以来、GraphQL の広範な採用は、一時的な傾向を超えたその価値を証明しています。

GraphQL の中核原則を理解する

GraphQL は API クエリ言語およびランタイムです。サーバーが応答構造を指示する従来の REST API とは異なり、GraphQL を使用すると、クライアントは単一のリクエストで正確なデータをリクエストできます。これにより、現代のアプリケーション開発の多くの課題が解決されます。

どんな本でもすぐに見つけてしまう知識豊富な図書館員を想像してみてください。複数のシェルフ (複数の API エンドポイント) を検索する代わりに、詳細なリクエストを提供すると、ライブラリアンは必要なものを正確に返します。それ以上でもそれ以下でもありません。

GraphQL のスキーマ駆動型の性質により、明確なクライアント/サーバー契約が作成されます。 各 GraphQL サービスはデータ型を定義し、予測可能で一貫性のある応答を実行する前にスキーマ検証を可能にします。

技術的基盤

GraphQL は、クエリ (データ取得)、ミューテーション (データ変更)、サブスクリプション (リアルタイム更新) の 3 つの主要な操作を使用します。 堅牢な型システムが各操作を支え、API 機能を定義します。

<code>type User {
  id: ID!
  name: String!
  email: String!
  posts: [Post!]!
  friends: [User!]!
}

type Post {
  id: ID!
  title: String!
  content: String!
  author: User!
  comments: [Comment!]!
  createdAt: String!
}

type Comment {
  id: ID!
  text: String!
  author: User!
  post: Post!
}</code>

スキーマは関係を定義し、単一のクエリでネストされたデータ (ユーザーの投稿や友達など) を取得できるようにします。

リゾルバー: GraphQL の中心

GraphQL の威力はリゾルバー機能にあります。これらの関数は、各スキーマ フィールドのデータを取得します。 リゾルバーは、データベースからデータをフェッチしたり、他の API を呼び出したり、複雑な計算を実行したりすることができ、すべてクライアントに対して透過的です。

リゾルバーの例 (Prisma を使用)

Prisma を使用してユーザーの投稿や友達を取得するためのリゾルバーを実装する方法は次のとおりです。

<code>const resolvers = {
  User: {
    async posts(parent, args, context) {
      const posts = await context.prisma.post.findMany({
        where: { authorId: parent.id },
        orderBy: { createdAt: 'desc' },
      });
      return posts;
    },
    async friends(parent, args, context) {
      const friends = await context.prisma.user.findMany({
        where: {
          id: { in: parent.friendIds },
        },
      });
      return friends;
    },
  },
};</code>

これらのリゾルバーは、要求された場合にのみ効率的にデータを取得します。

API 開発の進化

REST API だけが使われていた時代を覚えていますか?複数のエンドポイントが固定データ構造を返しました。 これは単純なアプリケーションでは機能しましたが、複雑さが増すにつれて扱いにくくなりました。モバイルと Web クライアントは異なるデータを必要としたため、複数の API 呼び出しが発生しました。

N 1 クエリ問題の解決

N 1 クエリの問題 (複数のデータベース クエリを使用して関連データを取得する) は、API の重要な課題です。 DataLoader や同様のツールを使用してクエリをバッチ処理し、最適化する GraphQL の機能は、パフォーマンスを大きく変えます。

実装例(DataLoader):

関連データを取得すると、N 1 問題が発生することがよくあります。 GraphQL は、DataLoader、データベース呼び出しのバッチ処理およびキャッシュなどのツールを使用してこの問題に対処します。

<code>type User {
  id: ID!
  name: String!
  email: String!
  posts: [Post!]!
  friends: [User!]!
}

type Post {
  id: ID!
  title: String!
  content: String!
  author: User!
  comments: [Comment!]!
  createdAt: String!
}

type Comment {
  id: ID!
  text: String!
  author: User!
  post: Post!
}</code>

これにより、リクエストをバッチ処理することでデータベース クエリが最小限に抑えられ、パフォーマンスが大幅に向上します。

実際の成功事例

• Netflix の動的ユーザー インターフェイス: Netflix は、デバイス間の動的 UI に GraphQL を使用し、コンテキストに基づいて正確な番組情報を取得します。
• GitHub の API 革命: GitHub の v4 API から GraphQL への切り替えにより、応答ペイロード サイズが削減され、開発者の柔軟性が向上しました。

Node.js と Apollo Server を使用した GraphQL の実装

実際の実装は次のとおりです。

1. 依存関係をインストールします: npm install @apollo/server graphql

2. スキーマを定義します:

<code>const resolvers = {
  User: {
    async posts(parent, args, context) {
      const posts = await context.prisma.post.findMany({
        where: { authorId: parent.id },
        orderBy: { createdAt: 'desc' },
      });
      return posts;
    },
    async friends(parent, args, context) {
      const friends = await context.prisma.user.findMany({
        where: {
          id: { in: parent.friendIds },
        },
      });
      return friends;
    },
  },
};</code>

3. リゾルバーの追加:

<code>const DataLoader = require('dataloader');

const userLoader = new DataLoader(async (userIds) => {
  const users = await prisma.user.findMany({
    where: {
      id: { in: userIds },
    },
  });
  return userIds.map(id => users.find(user => user.id === id));
});

const resolvers = {
  Post: {
    async author(parent) {
      return userLoader.load(parent.authorId);
    },
  },
};</code>

4. サーバーを起動します:

<code>const typeDefs = `#graphql
type Query {
  hello: String
}`;</code>

フィールド選択によるパフォーマンスの最適化 (Prisma)

GraphQL は、要求されたフィールドに基づいてデータベース クエリを最適化します。

<code>const resolvers = {
  Query: {
    hello: () => "Hello, GraphQL!",
  },
};</code>

これにより、必要なデータのみが取得され、オーバーヘッドが削減されます。

GraphQL の将来

• Apollo Federation: 統合された API を提示しながら、GraphQL スキーマを複数のサービスに分割できるようにします。
• サブスクリプションによるリアルタイム機能: ライブ通知と共同アプリケーションのリアルタイム更新を有効にします。 graphql-subscriptions を使用した例:

<code>const { ApolloServer } = require('@apollo/server');

const server = new ApolloServer({ typeDefs, resolvers });
server.listen().then(({ url }) => {
  console.log(`? Server ready at ${url}`);
});</code>

GraphQL 入門

GraphQL の段階的な導入は重要な利点です。 まず、既存の REST API と並行して、おそらくプロキシ層として実装します。これにより、リスクを最小限に抑えながら利点を実現できます。

結論

GraphQL は、データの取得とクライアント/サーバー間の通信におけるパラダイムシフトです。アプリケーションが成長するにつれて、その柔軟性と効率性がますます重要になります。 パフォーマンス、開発者エクスペリエンス、ユーザー満足度を向上させるために、GraphQL を検討してください。小さな実験から始めて、徐々に使用を拡大してください。コミュニティとエコシステムが繁栄している今、GraphQL を開発スタックに統合するのに最適な時期です。

参考文献

1. GraphQL 公式ドキュメント
2. Apollo GraphQL プラットフォーム
3. Netflix エンジニアリング - GraphQL フェデレーション
4. GitHub GraphQL API ケーススタディ
5. GraphQL のベストプラクティス

著者について

Ivan Duarte は、Web 開発と AI に情熱を注ぐフリーランスのバックエンド開発者です。

ニュースレターを購読する

ByteUp の記事を受信箱で直接読んでください。今すぐ購読してください!

以上がGraphQL 変換 API 開発の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。