著者はhttps://www.brightfunds.org/organizations/wikimedia-foundation-inc [ウィキメディア財団]を選択して、https://do.co/w4do-cta [寄付のために書く]プログラムの一環として寄付を受け取りました.

前書き

GraphQLは、さまざまなデータコレクションのデータを簡単にクエリおよび変更できるAPIのクエリ言語として、2015年にFacebookによって公開されました。 単一のエンドポイントから、単一のPOST要求で複数のデータソースを照会および変更できます。 GraphQLは、エンドポイントが実際に必要な情報より多くの情報を返す状況など、REST APIアーキテクチャの一般的な設計上の欠陥のいくつかを解決します。 また、REST APIを使用する場合、要求を複数のRESTエンドポイントに送信して、必要なすべての情報を収集する必要があります。これはn + 1問題と呼ばれます。 これの例は、ユーザーの情報を表示したいが、さまざまなエンドポイントから個人の詳細や住所などのデータを収集する必要がある場合です。

GraphQLにはエンドポイントが1つしかなく、複数のコレクションからデータを返すことができるため、これらの問題はGraphQLには当てはまりません。 返されるデータは、このエンドポイントに送信する_query_によって異なります。 このクエリでは、ネストしたデータコレクションを含む、受信するデータの構造を定義します。 クエリに加えて、_mutation_を使用してGraphQLサーバー上のデータを変更し、_subscription_を使用してデータの変更を監視することもできます。 GraphQLとその概念の詳細については、公式Webサイトのhttps://graphql.org/learn/[documentation]をご覧ください。

GraphQLは柔軟性が非常に高いクエリ言語であるため、https://www.mongodb.com/ [MongoDB]のようなドキュメントベースのデータベースと特にうまく組み合わされます。 両方のテクノロジーは、階層型の型付きスキーマに基づいており、JavaScriptコミュニティ内で人気があります。 また、MongoDBのデータはJSONオブジェクトとして保存されるため、GraphQLサーバーで追加の解析を行う必要はありません。

このチュートリアルでは、Ubuntu 18.04で実行されているMongoDBデータベースのデータをクエリおよび変更できるNode.jsを使用してGraphQLサーバーを構築およびデプロイします。 このチュートリアルの最後では、端末を介してサーバーに直接リクエストを送信するか、既製のGraphiQLプレイグラウンドインターフェースを使用することで、単一のエンドポイントを使用してデータベースのデータにアクセスできます。 このプレイグラウンドでは、クエリ、ミューテーション、およびサブスクリプションを送信することにより、GraphQLサーバーのコンテンツを探索できます。 また、このサーバーに対して定義されているスキーマの視覚的表現を見つけることができます。

このチュートリアルの最後で、GraphiQLプレイグラウンドを使用して、GraphQLサーバーとすばやくインターフェイスします。

image:https://assets.digitalocean.com/articles/cart_64864/GraphiQL_1.png [動作中のGraphiQLプレイグラウンド]

前提条件

このガイドを始める前に、次のものが必要です。

  • Ubuntu 18.04初期サーバーセットアップガイドに従って、sudo non- rootユーザーとファイアウォール。

  • Ubuntu 18.04で実行されるMongoDBインストール。チュートリアルhttps://www.digitalocean.com/community/tutorials/how-to-install-mongodb-on-ubuntu-18-04 [インストール方法]に従ってセットアップできます。 Ubuntu 18.04上のMongoDB]。

  • Ubuntu 18.04にNginxをインストールする方法にあるように、* Stepを含むNginxがインストールされている4 –サーバーブロックのセットアップ*。

  • GraphQLサーバーへのリモートアクセスを許可するには、完全修飾ドメイン名(FQDN)と、サーバーIPを指すAレコードが必要です。 これについて詳しくは、https://www.digitalocean.com/community/tutorials/an-introduction-to-dns-terminology-components-and-concepts [DNSの用語、コンポーネント、および概念の概要]をご覧ください。 、またはDigitalOceanアカウントをお持ちの場合はhttps://www.digitalocean.com/docs/networking/dns/ [ドメインとDNSドキュメント]。

  • JavaScriptの知識。https://www.digitalocean.com/community/tutorial_series/how-to-code-in-javascript [JavaScriptのコーディング方法]シリーズから得られます。

ステップ1-MongoDBデータベースのセットアップ

GraphQLサーバーを作成する前に、データベースが正しく構成され、認証が有効になっていること、およびサンプルデータが入力されていることを確認してください。 このためには、コマンドプロンプトからMongoDBデータベースを実行しているUbuntu 18.04サーバーに接続する必要があります。 このチュートリアルのすべての手順は、このサーバーで実行されます。

接続を確立したら、次のコマンドを実行して、MongoDBがアクティブでサーバーで実行されているかどうかを確認します。

sudo systemctl status mongodb

端末に次の出力が表示され、MongoDBデータベースがアクティブに実行されていることが示されます。

Output● mongodb.service - An object/document-oriented database
  Loaded: loaded (/lib/systemd/system/mongodb.service; enabled; vendor preset: enabled)
   since Sat 2019-02-23 12:23:03 UTC; 1 months 13 days ago
    Docs: man:mongod(1)
Main PID: 2388 (mongod)
   Tasks: 25 (limit: 1152)
  CGroup: /system.slice/mongodb.service
          └─2388 /usr/bin/mongod --unixSocketPrefix=/run/mongodb --config /etc/mongodb.conf

サンプルデータを保存するデータベースを作成する前に、通常のユーザーは特定のデータベースを対象としているため、最初に* admin *ユーザーを作成する必要があります。 これを行うには、MongoDBシェルを開く次のコマンドを実行します。

mongo

MongoDBシェルを使用すると、MongoDBデータベースに直接アクセスでき、ユーザーまたはデータベースを作成してデータを照会できます。 このシェル内で、MongoDBに新しい* admin *ユーザーを追加する次のコマンドを実行します。 強調表示されたキーワードを独自のユーザー名とパスワードの組み合わせに置き換えることができますが、それらをどこかに書き留めることを忘れないでください。

use admin
db.createUser({
   user: "",
   pwd: "",
   roles: [{ role: "root", db: "admin"}]
})

上記のコマンドの最初の行は、「+ admin 」というデータベースを選択します。これは、すべての管理ロールが保存されているデータベースです。 メソッド ` db.createUser()+`を使用すると、実際のユーザーを作成し、そのユーザー名、パスワード、ロールを定義できます。

このコマンドを実行すると、次が返されます。

OutputSuccessfully added user: {
   "user" : "",
   "roles" : [
       {
           "role" : "root",
           "db" : "admin"
       }
   ]
}

「+ exit +」と入力して、MongoDBシェルを閉じることができます。

次に、MongoDBシェルに再度ログインしますが、今回は新しく作成した* admin *ユーザーでログインします。

mongo -u "" -p "" --authenticationDatabase "admin"

このコマンドは、特定のユーザーとしてMongoDBシェルを開きます。「-u +」フラグはユーザー名を指定し、「-p 」フラグはそのユーザーのパスワードを指定します。 追加のフラグ `-authenticationDatabase +`は、* admin *としてログインすることを指定します。

次に、新しいデータベースに切り替えて、 `+ db.createUser()+`メソッドを使用して、このデータベースに変更を加える権限を持つ新しいユーザーを作成します。 強調表示されたセクションを独自の情報で置き換え、これらの資格情報を書き留めてください。

MongoDBシェルで次のコマンドを実行します。

use
db.createUser({
   user: "",
   pwd: "",
   roles: ["readWrite"]
})

これは以下を返します。

OutputSuccessfully added user: { "user" : "", "roles" : ["readWrite"] }

データベースとユーザーを作成した後、このデータベースに、このチュートリアルの後半でGraphQLサーバーが照会できるサンプルデータを入力します。 これには、MongoDB Webサイトのhttps://docs.mongodb.com/manual/reference/bios-example-collection/#the-bios-example-collection[bios collection]サンプルを使用できます。 次のコードスニペットのコマンドを実行することにより、この `+ bios `コレクションデータセットの小さいバージョンをデータベースに挿入します。 強調表示されたセクションを独自の情報に置き換えることができますが、このチュートリアルの目的のために、コレクションに「+」という名前を付けます。

db..insertMany([
  {
      "_id" : 1,
      "name" : {
          "first" : "John",
          "last" : "Backus"
      },
      "birth" : ISODate("1924-12-03T05:00:00Z"),
      "death" : ISODate("2007-03-17T04:00:00Z"),
      "contribs" : [
          "Fortran",
          "ALGOL",
          "Backus-Naur Form",
          "FP"
      ],
      "awards" : [
          {
              "award" : "W.W. McDowell Award",
              "year" : 1967,
              "by" : "IEEE Computer Society"
          },
          {
              "award" : "National Medal of Science",
              "year" : 1975,
              "by" : "National Science Foundation"
          },
          {
              "award" : "Turing Award",
              "year" : 1977,
              "by" : "ACM"
          },
          {
              "award" : "Draper Prize",
              "year" : 1993,
              "by" : "National Academy of Engineering"
          }
      ]
  },
  {
      "_id" : ObjectId("51df07b094c6acd67e492f41"),
      "name" : {
          "first" : "John",
          "last" : "McCarthy"
      },
      "birth" : ISODate("1927-09-04T04:00:00Z"),
      "death" : ISODate("2011-12-24T05:00:00Z"),
      "contribs" : [
          "Lisp",
          "Artificial Intelligence",
          "ALGOL"
      ],
      "awards" : [
          {
              "award" : "Turing Award",
              "year" : 1971,
              "by" : "ACM"
          },
          {
              "award" : "Kyoto Prize",
              "year" : 1988,
              "by" : "Inamori Foundation"
          },
          {
              "award" : "National Medal of Science",
              "year" : 1990,
              "by" : "National Science Foundation"
          }
      ]
  }
]);

このコードブロックは、過去の成功した科学者に関する情報を含む複数のオブジェクトで構成される配列です。 これらのコマンドを実行してこのコレクションをデータベースに入力すると、データが追加されたことを示す次のメッセージが表示されます。

Output{
   "acknowledged" : true,
   "insertedIds" : [
       1,
       ObjectId("51df07b094c6acd67e492f41")
   ]
}

成功メッセージが表示されたら、「+ exit +」と入力してMongoDBシェルを閉じることができます。 次に、認証済みユーザーのみがデータにアクセスできるように、許可を有効にするようにMongoDBインストールを構成します。 MongoDBインストールの構成を編集するには、このインストールの設定を含むファイルを開きます。

sudo nano /etc/mongodb.conf

次のコードで強調表示されている行のコメントを解除して、許可を有効にします。

/etc/mongodb.conf

...
# Turn on/off security.  Off is currently the default
#noauth = true

...

これらの変更をアクティブにするには、次を実行してMongoDBを再起動します。

sudo systemctl restart mongodb

次のコマンドを実行して、データベースが再び実行されていることを確認します。

sudo systemctl status mongodb

これにより、次のような出力が生成されます。

Output● mongodb.service - An object/document-oriented database
  Loaded: loaded (/lib/systemd/system/mongodb.service; enabled; vendor preset: enabled)
   since Sat 2019-02-23 12:23:03 UTC; 1 months 13 days ago
    Docs: man:mongod(1)
Main PID: 2388 (mongod)
   Tasks: 25 (limit: 1152)
  CGroup: /system.slice/mongodb.service
          └─2388 /usr/bin/mongod --unixSocketPrefix=/run/mongodb --config /etc/mongodb.conf

ユーザーが作成したデータベースに確実に接続できるようにするには、次のコマンドを使用して、認証済みユーザーとしてMongoDBシェルを開いてみてください。

mongo -u "" -p "" --authenticationDatabase ""

これは以前と同じフラグを使用します。今回のみ、作成したデータベースに「+-authenticationDatabase +」が設定され、サンプルデータが入力されます。

これで、* admin *ユーザーと、サンプルデータを含むデータベースへの読み取り/書き込みアクセス権を持つ別のユーザーが正常に追加されました。 また、データベースでは許可が有効になっているため、アクセスするにはユーザー名とパスワードが必要です。 次の手順では、チュートリアルの後半でこのデータベースに接続するGraphQLサーバーを作成します。

ステップ2-GraphQLサーバーの作成

データベースを構成し、サンプルデータを入力したら、このデータをクエリおよび変更できるGraphQLサーバーを作成します。 これには、https://www.npmjs.com/package/express [Express]とhttps://graphql.org/graphql-js/express-graphql/ [+ express-graphql +]を使用します。 Node.jsで実行します。 ExpressはNode.js HTTPサーバーを迅速に作成するための軽量フレームワークであり、 `+ express-graphql +`はGraphQLサーバーを迅速に構築できるようにするミドルウェアを提供します。

最初のステップは、マシンが最新であることを確認することです。

sudo apt update

次に、次のコマンドを実行して、サーバーにNode.jsをインストールします。 Node.jsとともに、https://www.npmjs.com/ [npm]をインストールします。これは、Node.jsで実行されるJavaScriptのパッケージマネージャーです。

sudo apt install nodejs npm

インストールプロセスを実行した後、インストールしたNode.jsのバージョンが「+ v8.10.0 +」以上であるかどうかを確認します。

node -v

これは以下を返します。

Output

新しいJavaScriptプロジェクトを初期化するには、サーバーで「+ sudo +」ユーザーとして次のコマンドを実行し、強調表示されたキーワードをプロジェクトの名前に置き換えます。

まず、サーバーのルートディレクトリに移動します。

cd

そこに、プロジェクトにちなんだ名前の新しいディレクトリを作成します。

mkdir

このディレクトリに移動します。

cd

最後に、次のコマンドで新しいnpmパッケージを初期化します。

sudo npm init -y

`+ npm init -y `を実行すると、次の ` package.json +`ファイルが作成されたことを示す成功メッセージが表示されます。

OutputWrote to /home///package.json:

{
 "name": "",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   "test": "echo \"Error: no test specified\" && exit 1"
 },
 "keywords": [],
 "author": "",
 "license": "ISC"
}

プロジェクトを初期化したので、GraphQLサーバーのセットアップに必要なパッケージをインストールします。

sudo npm install --save express express-graphql graphql

`+ index.js +`という名前の新しいファイルを作成し、その後実行してこのファイルを開きます:

sudo nano index.js

次に、新しく作成したファイルに次のコードブロックを追加して、GraphQLサーバーをセットアップします。

index.js

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

// Construct a schema, using GraphQL schema language
const schema = buildSchema(`
 type Query {
   hello: String
 }
`);

// Provide resolver functions for your schema fields
const resolvers = {
 hello: () => 'Hello world!'
};

const app = express();
app.use('/graphql', graphqlHTTP({
 schema,
 rootValue: resolvers
}));
app.listen(4000);

console.log(`🚀 Server ready at http://localhost:4000/graphql`);

このコードブロックは、すべてが重要ないくつかの部分で構成されています。 最初に、GraphQL APIによって返されるデータのスキーマを記述します。

index.js

...
// Construct a schema, using GraphQL schema language
const schema = buildSchema(`
 type Query {
   hello: String
 }
`);
...

タイプ「+ Query」は、実行可能なクエリと結果を返す形式を定義します。 ご覧のとおり、定義されているクエリは、データを「+ String 」形式で返す「 hello +」のみです。

次のセクションでは、https://graphql.org/learn/execution/#root-fields-resolvers [resolvers]を確立します。データは、クエリ可能なスキーマに一致します。

index.js

...
// Provide resolver functions for your schema fields
const resolvers = {
 hello: () => 'Hello world!'
};
...

これらのリゾルバはスキーマに直接リンクされており、これらのスキーマに一致するデータを返します。

このコードブロックの最後の部分は、GraphQLサーバーを初期化し、ExpressでAPIエンドポイントを作成し、GraphQLエンドポイントが実行されているポートを記述します。

index.js

...
const app = express();
app.use('/graphql', graphqlHTTP({
 schema,
 rootValue: resolvers
}));
app.listen(4000);

console.log(`🚀 Server ready at http://localhost:4000/graphql`);

これらの行を追加したら、保存して `+ index.js`を終了します。

次に、GraphQLサーバーを実際に実行するには、Node.jsでファイル `+ index.js`を実行する必要があります。 これはコマンドラインから手動で行うことができますが、これを行うために `+ package.json +`ファイルを設定するのが一般的です。

`+ package.json`ファイルを開きます:

sudo nano package.json

このファイルに次の強調表示された行を追加します。

package.json

{
 "name": "project_name",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   ,
   "test": "echo \"Error: no test specified\" && exit 1"
 },
 "keywords": [],
 "author": "",
 "license": "ISC"
}

ファイルを保存して終了します。

GraphQLサーバーを起動するには、ターミナルで次のコマンドを実行します。

npm start

これを実行すると、ターミナルプロンプトが消え、GraphQLサーバーが実行されていることを確認するメッセージが表示されます。

Output🚀 Server ready at http://localhost:4000/graphql

別のターミナルセッションを開いた場合、次のコマンドを実行してGraphQLサーバーが実行されているかどうかをテストできます。 これは、ローカルエンドポイントへのGraphQLクエリを含む +-data +`フラグの後に、JSONボディを持つ `+ curl` + POST`リクエストを送信します。

curl -X POST -H "Content-Type: application/json" --data '{ "query": "{ hello }" }' http://localhost:4000/graphql

これにより、コードのGraphQLスキーマに記述されているとおりにクエリが実行され、リゾルバーで返されるデータと等しい予測可能なJSON形式でデータが返されます。

Output{ "data": { "hello": "Hello world!" } }

この手順では、サーバーでアクセスできるローカルエンドポイントで実行されているGraphQLサーバーの最初のバージョンを作成しました。 次に、リゾルバーをMongoDBデータベースに接続します。

ステップ3-MongoDBデータベースへの接続

GraphQLサーバーを順番に使用して、前に構成してデータを入力したMongoDBデータベースとの接続をセットアップし、このデータに一致する新しいスキーマを作成できるようになりました。

GraphQLサーバーからMongoDBに接続できるようにするには、ngoからMongoDBのJavaScriptパッケージをインストールします。

sudo npm install --save mongodb

これがインストールされたら、テキストエディタで `+ index.js`を開きます。

sudo nano index.js

次に、インポートされた依存関係の直後に次の強調表示されたコードを + index.js +`に追加し、強調表示された値にローカルMongoDBデータベースへの独自の接続詳細を入力します。 `+ username ++ password _、および` + database_name _`は、このチュートリアルの最初のステップで作成したものです。

index.js

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



...

これらの行は、ローカルMongoDBデータベースへの接続をhttps://graphql.org/learn/execution/#root-fields-resolvers[context]という関数に追加します。 このコンテキスト関数はすべてのリゾルバで利用できるため、これを使用してデータベース接続をセットアップします。

次に、 `+ index.js`ファイルで、次の強調表示された行を挿入して、GraphQLサーバーの初期化にコンテキスト関数を追加します。

index.js

...
const app = express();
app.use('/graphql', graphqlHTTP({
 schema,
 rootValue: resolvers

}));
app.listen(4000);

console.log(`🚀 Server ready at http://localhost:4000/graphql`);

これで、リゾルバーからこのコンテキスト関数を呼び出して、MongoDBデータベースから変数を読み取ることができます。 このチュートリアルの最初のステップを振り返ると、データベースに存在する値を確認できます。 ここから、このデータ構造に一致する新しいGraphQLスキーマを定義します。 定数 `+ schema +`の以前の値を次の強調表示された行で上書きします。

index.js

...
// Construct a schema, using GrahQL schema language





















...

タイプ「+ Query 」が変更され、新しいタイプ「 Bio 」のコレクションが返されるようになりました。 この新しいタイプは、他の2つの非スカラータイプ「 Name 」と「 Awards 」を含むいくつかのタイプで構成されています。つまり、これらのタイプは、「 String 」や「 Float + GraphQLスキーマの定義の詳細については、GraphQLのhttps://graphql.org/graphql-js/utilities/#buildschema[documentation]をご覧ください。

また、リゾルバーはデータベースのデータをスキーマに結び付けるので、スキーマに変更を加えたときにリゾルバーのコードを更新します。 「+ bios 」と呼ばれる新しいリゾルバを作成します。これは、スキーマにある「 Query」とデータベース内のコレクションの名前に相当します。 この場合、 `+ db.collection( ‘bios’)`のコレクションの名前は ` bios +`ですが、コレクションに別の名前を割り当てた場合は変更されることに注意してください。

次の強調表示された行を `+ index.js`に追加します。

index.js

...
// Provide resolver functions for your schema fields
const resolvers = {

};
...

この関数は、MongoDBデータベースから変数を取得するために使用できるコンテキスト関数を使用します。 コードにこれらの変更を加えたら、 `+ index.js`を保存して終了します。

これらの変更をアクティブにするには、GraphQLサーバーを再起動する必要があります。 キーボードの組み合わせ + CTRL + + `+ C +`を使用して現在のプロセスを停止し、次を実行してGraphQLサーバーを起動できます。

npm start

これで、更新されたスキーマを使用して、データベース内のデータをクエリできるようになりました。 スキーマを見ると、「+ bios」の「+ Query」がタイプ「+ Bio 」を返していることがわかります。このタイプは、タイプ「 Name +」を返すこともできます。

データベース内のすべてのBIOSのすべての姓と名を返すには、新しいターミナルウィンドウで次のリクエストをGraphQLサーバーに送信します。

curl -X POST -H "Content-Type: application/json" --data '{ "query": "{ bios { name { first, last } } }" }' http://localhost:4000/graphql

これも、スキーマの構造に一致するJSONオブジェクトを返します。

Output{"data":{"bios":[{"name":{"first":"John","last":"Backus"}},{"name":{"first":"John","last":"McCarthy"}}]}}

`+ Bio +`のタイプで説明されているタイプのいずれかを使用してクエリを拡張することにより、BIOSからより多くの変数を簡単に取得できます。

また、 `+ id `を指定してバイオを取得できます。 これを行うには、 ` Query`タイプに別のタイプを追加し、リゾルバーを拡張する必要があります。 これを行うには、テキストエディターで `+ index.js`を開きます。

sudo nano index.js

以下の強調表示されたコード行を追加します。

index.js

...
// Construct a schema, using GrahQL schema language
const schema = buildSchema(`
 type Query {
   bios: [Bio]

 }

 ...

 // Provide resolver functions for your schema fields
 const resolvers = {
   bios: (args, context) => context().then(db => db.collection('bios').find().toArray())

 };
 ...

ファイルを保存して終了します。

GraphQLサーバーを実行しているターミナルで、 + CTRL + + `+ C +`を押して実行を停止し、次を実行して再起動します。

npm start

別のターミナルウィンドウで、次のGraphQLリクエストを実行します。

curl -X POST -H "Content-Type: application/json" --data '{ "query": "{ bio(id: 1) { name { first, last } } }" }' http://localhost:4000/graphql

これは、「+ id 」が「+1」に等しいbioのエントリを返します。

Output{ "data": { "bio": { "name": { "first": "John", "last": "Backus" } } } }

GraphQLの機能は、データベースからデータをクエリできることだけではありません。データベース内のデータを変更することもできます。 これを行うには、 `+ index.js`を開きます:

sudo nano index.js

タイプ「+ Query 」の隣に、タイプ「 Mutation +」を使用することもできます。これにより、データベースを変更できます。 このタイプを使用するには、スキーマに追加し、強調表示された次の行を挿入して入力タイプを作成します。

index.js

...
// Construct a schema, using GraphQL schema language
const schema = buildSchema(`
 type Query {
   bios: [Bio]
   bio(id: Int): Bio
 }













...

これらの入力タイプは、リゾルバーでアクセスしてデータベースに新しいドキュメントを挿入するために使用できる入力として使用できる変数を定義します。 これを行うには、次の行を `+ index.js`に追加します。

index.js

...
// Provide resolver functions for your schema fields
const resolvers = {
 bios: (args, context) => context().then(db => db.collection('bios').find().toArray()),
 bio: (args, context) => context().then(db => db.collection('bios').findOne({ _id: args.id }))

};
...

通常のクエリのリゾルバーと同様に、 `+ index.js `でリゾルバーから値を返す必要があります。 タイプ「 Bio 」が変更される「 Mutation +」の場合、変更されたバイオの値を返します。

この時点で、 `+ index.js +`ファイルには次の行が含まれます。

index.js

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

const context = () => MongoClient.connect('mongodb://:@localhost:27017/', { useNewUrlParser: true })
 .then(client => client.db('GraphQL_Test'));

// Construct a schema, using GraphQL schema language
const schema = buildSchema(`
 type Query {
   bios: [Bio]
   bio(id: Int): Bio
 }
 type Mutation {
   addBio(input: BioInput) : Bio
 }
 input BioInput {
   name: NameInput
   title: String
   birth: String
   death: String
 }
 input NameInput {
   first: String
   last: String
 }
 type Bio {
   name: Name,
   title: String,
   birth: String,
   death: String,
   awards: [Award]
 }
 type Name {
   first: String,
   last: String
 },
 type Award {
   award: String,
   year: Float,
   by: String
 }
`);

// Provide resolver functions for your schema fields
const resolvers = {
 bios: (args, context) =>context().then(db => db.collection('Sample_Data').find().toArray()),
 bio: (args, context) =>context().then(db => db.collection('Sample_Data').findOne({ _id: args.id })),
 addBio: (args, context) => context().then(db => db.collection('Sample_Data').insertOne({ name: args.input.name, title: args.input.title, death: args.input.death, birth: args.input.birth})).then(response => response.ops[0])
};

const app = express();
app.use('/graphql', graphqlHTTP({
 schema,
 rootValue: resolvers,
 context
}));
app.listen(4000);

console.log(`🚀 Server ready at http://localhost:4000/graphql`);

保存して、 `+ index.js`を終了します。

新しい突然変異が機能しているかどうかを確認するには、GraphQLサーバーを実行しているターミナルで + CTRL + + + c +`を押して `+ npm start +`を実行してGraphQLサーバーを再起動し、別のターミナルセッションを開いて以下を実行します+ curl `リクエスト。 クエリの ` curl `リクエストと同様に、 `-data +`フラグの本文はGraphQLサーバーに送信されます。 ハイライトされた部分がデータベースに追加されます:

curl -X POST -H "Content-Type: application/json" --data '{ "query": "mutation { addBio(input: { name: { first: \"\", last: \"\" } }) { name { first, last } } }" }' http://localhost:4000/graphql

これにより、次の結果が返されます。つまり、データベースに新しいバイオを挿入しただけです。

Output{ "data": { "addBio": { "name": { "first": "", "last": "" } } } }

この手順では、MongoDBとGraphQLサーバーとの接続を作成し、GraphQLクエリを実行してこのデータベースからデータを取得および変更できるようにしました。 次に、このGraphQLサーバーをリモートアクセス用に公開します。

ステップ4-リモートアクセスを許可する

データベースとGraphQLサーバーをセットアップしたら、GraphQLサーバーを構成してリモートアクセスを許可できるようになりました。 このためには、前提条件のチュートリアルで設定したNginxを使用しますhttps://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-ubuntu-18-04-quickstart[How to Ubuntu 18.04にNginxをインストールします]。 このNginx設定は、 `+ / etc / nginx / sites-available / `ファイルにあります。ここで、 ` example.com +`は前提条件チュートリアルで追加したサーバー名です。

このファイルを編集用に開き、ドメイン名を「++」に置き換えます。

sudo nano /etc/nginx/sites-available/

このファイルには、ポート「80」をリッスンするサーバーブロックがあります。このブロックには、前提条件のチュートリアルで「+ server_name 」の値が既に設定されています。 このサーバーブロック内で、 ` root `の値をGraphQLサーバーのコードを作成したディレクトリに変更し、インデックスとして ` index.js `を追加します。 また、ロケーションブロック内で、サーバーのIPまたはカスタムドメイン名を使用してGraphQLサーバーを参照できるように、「 proxy_pass +」を設定します。

/etc/nginx/sites-available/example.com

server {
 listen 80;
 listen [::]:80;

 ;
 ;

 server_name ;

 location / {

 }
}

次を実行して、この構成ファイルにNginx構文エラーがないことを確認します。

sudo nginx -t

次の出力が表示されます。

Outputnginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

構成ファイルにエラーが見つからない場合、Nginxを再起動します。

sudo systemctl restart nginx

これで、ターミナルセッションタブからGraphQLサーバーにアクセスできるようになります。これには、サーバーのIPまたはカスタムドメイン名のいずれかで「++」を実行および置換します。

curl -X POST -H "Content-Type: application/json" --data '{ "query": "{ bios { name { first, last } } }" }' http://

これにより、突然変異を使用して追加した可能性のある追加データを含む、前のステップの1つと同じJSONオブジェクトが返されます。

Output{"data":{"bios":[{"name":{"first":"John","last":"Backus"}},{"name":{"first":"John","last":"McCarthy"}},{"name":{"first":"test","last":"user"}}]}}

GraphQLサーバーにリモートでアクセスできるようになったので、端末を閉じたりサーバーを再起動したときにGraphQLサーバーがダウンしないことを確認してください。 このようにして、MongoDBデータベースは、リクエストを行いたいときにいつでもGraphQLサーバー経由でアクセスできます。

これを行うには、npmパッケージhttps://www.npmjs.com/package/forever [+ forever +]を使用します。これは、コマンドラインスクリプトを継続的に実行するか、障害が発生した場合に再起動することを保証するCLIツールです。

npmで `+ forever +`をインストールします:

sudo npm install forever -g

インストールが完了したら、 `+ package.json +`ファイルに追加します:

package.json

{
 "name": "project_name",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   "start": "node index.js",

   "test": "echo \"Error: no test specified\" && exit 1"
 },
 ...

`+ forever +`を有効にしてGraphQLサーバーを起動するには、次のコマンドを実行します。

npm run deploy

これにより、GraphQLサーバーを含む `+ index.js `ファイルが ` forever +`で起動し、障害が発生した場合は再起動の間に2000ミリ秒と5ミリ秒の最小アップタイムで実行し続けることが保証されます。 GraphQLサーバーはバックグラウンドで継続的に実行されるようになったため、サーバーにリクエストを送信するときに新しいタブを開く必要がなくなりました。

これで、MongoDBを使用してデータを保存し、リモートサーバーからのアクセスを許可するように設定されたGraphQLサーバーを作成しました。 次の手順では、GraphiQLプレイグラウンドを有効にします。これにより、GraphQLサーバーの検査が容易になります。

ステップ5-GraphiQL Playgroundを有効にする

GraphQLサーバーにcURLリクエストを送信できることは素晴らしいことですが、特に開発中に、GraphQLリクエストをすぐに実行できるユーザーインターフェイスを使用する方が高速です。 このために、パッケージ `+ express-graphql +`でサポートされているインターフェイスであるGraphiQLを使用できます。

GraphQLを有効にするには、ファイル「+ index.js」を編集します。

sudo nano index.js

次の強調表示された行を追加します。

index.js

const app = express();
app.use('/graphql', graphqlHTTP({
 schema,
 rootValue: resolvers,
 context

}));
app.listen(4000);

console.log(`🚀 Server ready at http://localhost:4000/graphql`);

ファイルを保存して終了します。

これらの変更が見えるようにするには、次を実行して `+ forever +`を停止してください:

forever stop index.js

次に、GraphQLサーバーの最新バージョンが実行されるように、 `+ forever +`を再度開始します。

npm run deploy

URL「+ http:// 」でブラウザを開き、「+」をドメイン名またはサーバーIPに置き換えます。 GraphiQLプレイグラウンドが表示され、GraphQLリクエストを入力できます。

image:https://assets.digitalocean.com/articles/cart_64864/GraphiQL_2.png [GraphiQLプレイグラウンドの初期画面]

このプレイグラウンドの左側では、GraphQLクエリと突然変異を入力できますが、出力はプレイグラウンドの右側に表示されます。 これが機能しているかどうかをテストするには、左側に次のクエリを入力します。

query {
 bios {
   name {
     first
     last
   }
 }
}

これにより、プレイグラウンドの右側に同じ結果がJSON形式で出力されます。

image:https://assets.digitalocean.com/articles/cart_64864/GraphiQL_3.png [動作中のGraphiQLプレイグラウンド]

これで、ターミナルとGraphiQLプレイグラウンドを使用してGraphQLリクエストを送信できます。

結論

このチュートリアルでは、MongoDBデータベースを設定し、サーバーのGraphQL、Node.js、およびExpressを使用して、このデータベースからデータを取得および変更しました。 さらに、このサーバーへのリモートアクセスを許可するようにNginxを構成しました。 このGraphQLサーバーに直接リクエストを送信できるだけでなく、GraphiQLを視覚的なブラウザー内GraphQLインターフェースとして使用することもできます。

GraphQLの詳細については、https://www.ndcconferences.com/ [NDC \ {ロンドン}]またはhttps://howtographql.com [howtographql.com]のウェブサイトにアクセスして、GraphQLに関するチュートリアルをご覧ください。 GraphQLが他のテクノロジーとどのように相互作用するかを調べるには、https://www.digitalocean.com/community/tutorials/how-to-manually-set-up-a-prisma-server-on-ubuntu-18-のチュートリアルをご覧ください04 [Ubuntu 18.04でPrismaサーバーを手動で設定する方法]、およびMongoDBを使用したアプリケーションの構築の詳細については、https://www.digitalocean.com/community/tutorials/how-to-build-a-blog-を参照してくださいwith-nest-js-mongodb-and-vue-js [Nest.js、MongoDB、Vue.jsでブログを作成する方法]。