ホームページ  >  記事  >  ウェブフロントエンド  >  グラフQLノードJSクエリ

グラフQLノードJSクエリ

WBOY
WBOYオリジナル
2023-05-25 10:13:37560ブラウズ

GraphQL は、API でデータをリクエストするために使用できるクエリ言語です。これは、API でリクエストできるフィールドと各フィールドの型を定義するのに役立つ、厳密に型指定されたクエリ言語です。 GraphQL はもともと Facebook によって開発され、それ以来オープンソース化され、Web アプリケーションの構築に広く使用されています。

Node.js は、JavaScript を使用してサーバーサイド アプリケーションを作成できるようにする、人気のある JavaScript ランタイム環境です。 Node.js の効率性と堅牢なエコシステムは、高パフォーマンス API の構築に最適です。 Node.js には、GraphQL API を非常にシンプルかつ効率的に使用できる GraphQL ライブラリが多数あります。

この記事では、GraphQL を使用して Node.js でデータをクエリする方法を紹介します。 Node.js と Express フレームワークに基づく単純なアプリケーションを使用して、GraphQL を使用してデータをクエリします。

ステップ 1: シンプルな Express アプリケーションの作成と GraphQL の構成

まず、Node.js アプリケーションを作成する必要があります。 Express フレームワークを使用してアプリケーションを構築しましょう。アプリケーションを作成する前に、Node.js と npm がシステムにインストールされていることを確認してください。ターミナルに次のコマンドを入力することで、Node.js がインストールされているかどうかを確認できます。

node -v

Node.js が正常にインストールされている場合は、インストールされているバージョン番号が表示されるはずです。

次に、ターミナルで新しいプロジェクト ディレクトリを作成し、npm を初期化します。

mkdir nodejs-graphql-demo
cd nodejs-graphql-demo
npm init -y

次に、次のコマンドを使用して必要な依存関係をインストールします。

npm install express graphql express-graphql

続いて、これらの依存関係を詳しく理解してみましょう。

  • Express: Web アプリケーション フレームワーク。Node.js に基づいた Web アプリケーションの構築に役立ちます。
  • GraphQL: API でデータをリクエストするために使用できるクエリ言語。
  • express-graphql: Express フレームワーク用の GraphQL ミドルウェア。

次に、プロジェクトのホーム ディレクトリに新しいファイル server.js を作成し、次のコンテンツを追加します。

const express = require('express');
const { graphqlHTTP } = require('express-graphql');
const { buildSchema } = require('graphql');

const app = express();

const schema = buildSchema(`
  type Query {
    message: String
  }
`);

const root = {
  message: () => 'Hello World!'
};

app.use('/graphql', graphqlHTTP({
  schema: schema,
  rootValue: root,
  graphiql: true
}));

const PORT = process.env.PORT || 5000;

app.listen(PORT, () => console.log(`Server started on port ${PORT}`));

上記のコードでは、最初に Express、graphqlHTTP、およびbuildSchema モジュール。次に、Express インスタンスを作成し、buildSchema 関数を使用して単純なクエリ スキーマを定義します。このクエリ パターンには、message という名前のクエリ フィールドが 1 つだけ含まれており、文字列を返します。

次に、root という名前の JavaScript オブジェクトを定義します。このオブジェクトには、「Hello World!」を返すメッセージ関数が含まれています。 GraphQL では、このオブジェクトはルート リゾルバー オブジェクトと呼ばれます。 GraphQL のミドルウェアを定義し、先ほど作成したスキーマとルート リゾルバー オブジェクトを使用します。このミドルウェアは、/graphql にルーティングされたパス上で GraphQL サービスを提供し、graphiql オプションを true に設定すると、GraphiQL インターフェイスが有効になります。

最後に、Express インスタンスの listen メソッドを使用してアプリケーションを起動し、ポート 5000 で listen します。

ステップ 2: GraphQL クエリをテストする

GraphQL ミドルウェアが正常に構成されたので、クエリをテストできるようになりました。これを行うには Postman を使用しましょう。まず、Postman をインストールして起動する必要があります。ターミナルに次のコマンドを入力して Postman を開始します:

postman

次に、新しい POST リクエストを作成し、URL を http://localhost:5000/graphql に設定します。リクエスト本文で、GraphQL クエリ エディターに次のクエリを追加します。

query {
  message
}

これで、リクエストを送信して応答を表示できるようになります。応答には次の内容が含まれている必要があります:

{
    "data": {
        "message": "Hello World!"
    }
}

ご覧のとおり、GraphQL クエリから応答を正常に取得しました。さらに多くのクエリ フィールドとタイプを使用してクエリを強化しましょう。

ステップ 3: クエリ フィールドとタイプを追加する

次に、クエリ パターンを拡張して、さらに多くのフィールドとタイプを含めてみましょう。次の例を見てみましょう。

const schema = buildSchema(`
  type Query {
    message: String
    number: Int
    person: Person
  }

  type Person {
    name: String
    age: Int
    address: Address
  }

  type Address {
    street: String
    city: String
    state: String
    country: String
  }
`);

const root = {
  message: () => 'Hello World!',
  number: () => 42,
  person: () => ({
    name: 'John Doe',
    age: 30,
    address: { 
      street: '123 Main St',
      city: 'Anytown',
      state: 'CA',
      country: 'USA'
    }
  })
};

上記のコードでは、number という整数のクエリ フィールドと、person 型のオブジェクトを返す person というクエリ フィールドを追加しました。人物タイプと住所タイプも定義します。

ルート パーサー オブジェクトで、新しいフィールドと型に対応する関数を定義します。メッセージフィールドと数値フィールドはそれぞれ文字列と整数を返しますが、人物フィールドはフィールドと値が当社によって定義された人物オブジェクトを返します。

それでは、新しいクエリをテストしてみましょう。次のクエリを使用できます。

query {
  message
  number
  person {
    name
    age
    address {
      street
      city
      state
      country
    }
  }
}

応答には次の内容が含まれます。

{
  "data": {
    "message": "Hello World!",
    "number": 42,
    "person": {
      "name": "John Doe",
      "age": 30,
      "address": {
        "street": "123 Main St",
        "city": "Anytown",
        "state": "CA",
        "country": "USA"
      }
    }
  }
}

ご覧のとおり、新しいフィールドと型のクエリが正常に実行されました。必要に応じてフィールドと型を追加して、API でより有用なデータを返すことができます。

結論

この記事では、Node.js で GraphQL を使用してデータをクエリする方法を学びました。 Express フレームワークに基づいて単純なアプリケーションを作成し、Express ミドルウェアと GraphQL モジュールを使用してプログラムでデータをクエリしました。また、クエリを強化するために、クエリ フィールドとタイプも追加しました。 GraphQL は、効率的でスケーラブルな API の構築に役立つ非常に強力で便利なツールです。

以上がグラフQLノードJSクエリの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。