node.jsとmongodbを使用してGraphQL Serverを作成します

キーテイクアウト

• node.jsとExpressを使用してサーバーを確立し、Mongodbをデータ管理のためにMongooseと統合し、クエリと突然変異を効率的に処理するサーバーの能力を高めます。 Express-GraphQLミドルウェアを使用してサーバーにGraphQLを実装します。これにより、ユーザーフレンドリーなJSON形式の作成に重点を置いて、HTTPリクエストの処理とJSON応答の出力を簡素化します。
データインタラクションを正確に管理するためのタイプ、クエリ、および突然変異で構成されるGraphQLスキーマを定義し、データ構造が一貫性とセキュリティのためにMongoDBモデルと整列することを保証します。 GraphQLクエリを使用して単一のHTTP要求で特定のデータフィールドを取得することにより、データ検索を最適化し、特にネットワーク接続が遅いモバイルデバイスで転送されるデータの量を大幅に削減し、パフォーマンスを改善します。
• Postmanなどのツールを使用してGraphQLエンドポイントをテストして、クエリと突然変異のセットアップと機能を検証し、サーバーがさまざまなデータ要求に正しく効率的に応答するようにします。
• この記事は、ライアン・チェンキーによって査読されました。 SetePointコンテンツを最高にするためにSitePointのピアレビュアーのすべてに感謝します！ クライアント側のサーバーからデータを要求することは、新しい概念ではありません。これにより、アプリケーションはページを更新せずにデータをロードできます。これは、サーバーからレンダリングされたページを取得する代わりに、クライアント側にレンダリングするために必要なデータのみを要求する単一ページアプリケーションで最も使用されています。
• 過去数年間でWeb全体で最も一般的なアプローチは、REST Architectural Styleです。ただし、このアプローチは、高いデータ需要アプリケーションにいくつかの制限をもたらします。 RESTFULシステムでは、複数のHTTP要求を行い、必要なすべてのデータを取得する必要があります。これには、パフォーマンスに大きな影響があります。単一のHTTPリクエストで複数のリソースを要求する方法があった場合はどうなりますか？
• クライアント側とサーバー側の間の通信を統合するクエリ言語であるGraphQLの導入。クライアント側は、単一のリクエストで、必要なデータを正確に説明できます。 この記事では、すべてのクエリと突然変異を処理するGraphQLルートを備えたnode.js/Expressサーバーを作成します。次に、いくつかの投稿リクエストを送信してこのルートをテストし、郵便配達員を使用して結果を分析します。
このアプリケーションの完全なソースコードをここで見つけることができます。また、ここからダウンロードできる郵便配達員コレクションも作成しました。 ExpressサーバーでGraphQLエンドポイントを設定します

最初に行うことは、Expressフレームワークを使用してnode.jsサーバーを作成することです。また、MongodbとMongooseを使用してデータの持続性を使用し、BabelはES6を使用します。コードは実行時にES5に輸送されるため、ビルドプロセスは必要ありません。これはindex.js：で行われます

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

この記事のコンテキストでは、上記のコードの最も相対的な部分は、GraphQLルートを定義する場所です。 FacebookのGraphQLチームによって開発されたExpress MiddlewareであるExpress-GraphQLを使用しています。これにより、GraphQLを介してHTTP要求を処理し、JSON応答を返します。これを機能させるには、次のセクションで説明するGraphQLスキーマのオプションを通過する必要があります。また、オプションをかなり真実に設定しています。これにより、JSONの応答がきれいに印刷され、読みやすくなります。

graphql schema

<span>// app.js
</span><span>import express from 'express';
</span><span>import graphqlHTTP from 'express-graphql';
</span><span>import mongoose from 'mongoose';
</span>
<span>import schema from './graphql';
</span>
<span>var app = express();
</span>
<span>// GraphqQL server route
</span>app<span>.use('/graphql', graphqlHTTP(req => ({
</span>  schema<span>,
</span>  <span>pretty: true
</span><span>})));
</span>
<span>// Connect mongo database
</span>mongoose<span>.connect('mongodb://localhost/graphql');
</span>
<span>// start server
</span><span>var server = app.listen(8080, () => {
</span>  <span>console.log('Listening at port', server.address().port);
</span><span>});
</span>

GraphQLがリクエストを理解するには、スキーマを定義する必要があります。そして、GraphQLスキーマは、クエリと突然変異のグループに他なりません。クエリは、データベースから取得して、データベースへのあらゆる種類の更新として変異を取得するためのリソースと考えることができます。例として、ブログポストとコメントマングースモデルを作成し、その後、いくつかのクエリと突然変異を作成します。

mongooseモデル

Mongooseモデルを作成することから始めましょう。 Mongooseはこの記事の焦点では​​ないため、ここではあまり詳しく説明しません。モデル/blog-post.jsとmodels/comment.jsで2つのモデルを見つけることができます。

graphqlタイプ

Mongooseのように、GraphQlではデータ構造を定義する必要があります。違いは、クエリと突然変異ごとに定義し、どのタイプのデータが入力できるか、応答で送信されるものを定義することです。これらのタイプが一致しない場合、エラーがスローされます。冗長に見えるかもしれませんが、マングースでスキーマモデルをすでに定義しているため、次のような大きな利点があります。

あなたは許可されているものを制御します。これにより、システムセキュリティが向上します許可されているものを制御します。これは、特定のフィールドを定義して、取得することを許可されないことを意味します。たとえば、パスワードまたはその他の機密データ

それは無効な要求をフィルタリングして、それ以上の処理が行われないようにし、サーバーのパフォーマンスを改善できる

GraphQLタイプのソースコードをGRAPHQL/TYPES/で見つけることができます。次の例は次のとおりです
ここでは、ブログ投稿出力GraphQLタイプを定義しています。これは、クエリと突然変異を作成するときにさらに使用します。構造がMongoose Model blogpostに似ていることに注意してください。それは仕事の複製のように見えるかもしれませんが、これらは分離された懸念です。 Mongooseモデルはデータベースのデータ構造を定義します。GraphQLタイプは、サーバーのクエリまたは変異で受け入れられているもののルールを定義します。
• GraphQl Schema Creation
• Mongooseモデルと作成されたGraphQLタイプを使用して、GraphQLスキーマを作成できるようになりました。

ここでは、クエリと突然変異という2つの特性を定義するGraphQlschemaをエクスポートします。 GraphQlobjectTypeは、多くのGraphQLタイプの1つです。特にこれを使用すると、次の指定できます

• 名前 - これは一意であり、オブジェクトを識別する必要があります;
• フィールド - この場合よりもオブジェクトを受け入れるプロパティは、私たちのクエリと突然変異になります。

別の場所からクエリと突然変異をインポートしていますが、これは構造目的のみを目的としています。ソースコードは、モデル、クエリ、突然変異などを追加したい場合に、プロジェクトが適切にスケーリングできるようにする方法で構成されています。

フィールドに通過するクエリと変異変数は、単純なJavaScriptオブジェクトです。キーは、突然変異名またはクエリ名です。値は、GraphQLにそれらをどうするかを伝える構成を備えた単純なJavaScriptオブジェクトです。次のGraphQLクエリを例として見てみましょう

grahpqlについては、このクエリで何をすべきかを理解するには、ブログ投稿とコメントクエリを定義する必要があります。したがって、私たちのクエリ変数は次のようなものになります：

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

変異についても同じことが言えます。これは、クエリまたは突然変異にあるキーとクエリに入れた名前の間に直接的な関係があることを説明するためです。次に、これらのクエリと突然変異のそれぞれがどのように定義されているかを見てみましょう。

<span>// app.js
</span><span>import express from 'express';
</span><span>import graphqlHTTP from 'express-graphql';
</span><span>import mongoose from 'mongoose';
</span>
<span>import schema from './graphql';
</span>
<span>var app = express();
</span>
<span>// GraphqQL server route
</span>app<span>.use('/graphql', graphqlHTTP(req => ({
</span>  schema<span>,
</span>  <span>pretty: true
</span><span>})));
</span>
<span>// Connect mongo database
</span>mongoose<span>.connect('mongodb://localhost/graphql');
</span>
<span>// start server
</span><span>var server = app.listen(8080, () => {
</span>  <span>console.log('Listening at port', server.address().port);
</span><span>});
</span>

queries

クエリから始めて、これまでに作成したモデルを使用して、例からピックアップしましょう。良い例は、ブログ投稿とそのすべてのコメントを取得することです。

休憩ソリューションでは、これに対して2つのHTTPリクエストを行う必要があります。 1つはブログ投稿を取得し、もう1つはコメントを取得するために、これは次のようになります。

graphqlでは、次のクエリを使用して、1つのHTTPリクエストでのみこれを作成できます。

1つのリクエストで必要なすべてのデータを取得できます。これだけでパフォーマンスが向上します。また、使用する正確なプロパティを要求することもできます。上記の例では、応答はブログ投稿のタイトルと説明のみをもたらすだけであり、コメントはテキストのみをもたらすだけです。

各リソースから必要なフィールドのみを取得すると、Webページまたはアプリケーションの読み込み時間に大きな影響を与える可能性があります。たとえば、コメントを見てみましょう。コメントには、_idとpostidプロパティもあります。これらのそれぞれは、それぞれ正確には12バイトで、12バイトです（オブジェクトキーではカウントされません）。これは、単一またはいくつかのコメントである場合、ほとんど影響を与えません。たとえば、200のコメントについて話しているとき、それは4800バイトを超えていません。そして、それはアプリケーションの読み込み時間に大きな違いをもたらす可能性があります。これは、通常、ネットワーク接続が遅いモバイルのリソースなど、リソースが限られているデバイスにとって特に重要です。 これが機能するためには、特定のクエリごとにデータを取得する方法をGraphQLに伝える必要があります。クエリ定義の例を見てみましょう：

<span>// graphql/types/blog-post.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLNonNull,
</span></span><span>  <span>GraphQLString,
</span></span><span>  <span>GraphQLID
</span></span><span><span>}</span> from 'graphql';
</span>
<span>export default new GraphQLObjectType({
</span>  <span>name: 'BlogPost',
</span>  <span>fields: {
</span>    <span>_id: {
</span>      <span>type: new GraphQLNonNull(GraphQLID)
</span>    <span>},
</span>    <span>title: {
</span>      <span>type: GraphQLString
</span>    <span>},
</span>    <span>description: {
</span>      <span>type: GraphQLString
</span>    <span>}
</span>  <span>}
</span><span>});
</span>

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

ここでは、IDパラメーターに基づいて単一のブログ投稿を取得するクエリを作成しています。クエリの出力を検証する以前に作成したタイプを指定していることに注意してください。また、このクエリに必要なargumentsを使用してARGSオブジェクトを設定しています。そして最後に、データベースを照会してデータを返す解決関数。

データの取得プロセスをさらに最適化し、MongoDBの投影機能を活用するために、GraphQLがMongooseと互換性のある投影を生成するために提供するASTを処理しています。したがって、次のクエリを作成した場合：

<span>// app.js
</span><span>import express from 'express';
</span><span>import graphqlHTTP from 'express-graphql';
</span><span>import mongoose from 'mongoose';
</span>
<span>import schema from './graphql';
</span>
<span>var app = express();
</span>
<span>// GraphqQL server route
</span>app<span>.use('/graphql', graphqlHTTP(req => ({
</span>  schema<span>,
</span>  <span>pretty: true
</span><span>})));
</span>
<span>// Connect mongo database
</span>mongoose<span>.connect('mongodb://localhost/graphql');
</span>
<span>// start server
</span><span>var server = app.listen(8080, () => {
</span>  <span>console.log('Listening at port', server.address().port);
</span><span>});
</span>

データベースからタイトルと説明を取得するだけであるため、getProjection関数はマングースの有効な投影を生成します：

<span>// graphql/types/blog-post.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLNonNull,
</span></span><span>  <span>GraphQLString,
</span></span><span>  <span>GraphQLID
</span></span><span><span>}</span> from 'graphql';
</span>
<span>export default new GraphQLObjectType({
</span>  <span>name: 'BlogPost',
</span>  <span>fields: {
</span>    <span>_id: {
</span>      <span>type: new GraphQLNonNull(GraphQLID)
</span>    <span>},
</span>    <span>title: {
</span>      <span>type: GraphQLString
</span>    <span>},
</span>    <span>description: {
</span>      <span>type: GraphQLString
</span>    <span>}
</span>  <span>}
</span><span>});
</span>

ソースコードでGraphQL/Queries/*で他のクエリを見ることができます。上記の例に似ているので、それぞれを通過しません。

突然変異

変異は、データベースの何らかの変化を処理する操作です。クエリと同様に、単一のHTTP要求に異なる変異をグループ化できます。通常、「コメントを追加」や「ブログ投稿の作成」など、アクションが隔離されます。ただし、アプリケーションとデータ収集の複雑さが高まり、分析、ユーザーエクスペリエンステスト、または複雑な操作を対象としていますが、ウェブサイトまたはアプリケーションでのユーザーアクションは、データベースの異なるリソースにかなりの数の変異をトリガーできます。この例に従って、ブログ投稿の新しいコメントは、新しいコメントとブログ投稿のコメントカウントの更新を意味する場合があります。休憩ソリューションでは、次のようなものがあります。

graphqlを使用すると、次のようなものを使用して1つのHTTPリクエストでのみ実行できます。

<span>// graphql/index.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLSchema
</span></span><span><span>}</span> from 'graphql';
</span>
<span>import mutations from './mutations';
</span><span>import queries from './queries';
</span>
<span>export default new GraphQLSchema({
</span>  <span>query: new GraphQLObjectType({
</span>    <span>name: 'Query',
</span>    <span>fields: queries
</span>  <span>}),
</span>  <span>mutation: new GraphQLObjectType({
</span>    <span>name: 'Mutation',
</span>    <span>fields: mutations
</span>  <span>})
</span><span>});
</span>

クエリと突然変異の構文はまったく同じであり、突然変異にクエリを変更するだけであることに注意してください。 クエリから行うのと同じように、突然変異からデータを尋ねることができます。 BlogPostCommentINCの上記のクエリにあるように、フラグメントを指定しないことで、操作を確認するのに十分な場合が多い真または誤った返品値を求めています。または、AddComment変異のようなデータを要求することもできます。これは、サーバーで生成されたデータのみを取得するのに役立ちます。

次に、サーバーの突然変異を定義しましょう。突然変異は、クエリとして正確に作成されます：

query <span>{
</span>    blogPosts <span>{
</span>        _id<span>,
</span>        title
    <span>}
</span>    comments <span>{
</span>        text   
    <span>}
</span><span>}
</span>

この突然変異は、新しいブログ投稿を追加し、成功した場合にtrueを返します。タイプで、どのように返されるかを指定する方法に注意してください。 ARGSでは、突然変異から受けた議論。クエリ定義のように、Resolve（）機能。 GraphQLエンドポイントのテスト

<span>{
</span>    <span>blogPosts: {...},
</span>    <span>comments: {...}
</span><span>}
</span>

グラフQLルートといくつかのクエリと突然変異を備えたExpressサーバーを作成したので、いくつかのリクエストを送信してテストしましょう。

次のような場所にGet Requestを送信または投稿する方法はたくさんあります。

• ブラウザ - ブラウザにURLを入力することにより、GETリクエストを送信します。これには、投稿リクエストを送信できないという制限があります
• curl - コマンドラインファン向け。あらゆる種類のリクエストをサーバーに送信できます。それは最高のインターフェイスではありませんが、リクエストを保存することはできず、コマンドラインにすべてを書く必要があります。
graphiql - graphqlに最適なソリューション。これは、サーバーにクエリを作成するために使用できるブラウザIDEです。次のような素晴らしい機能があります：構文の強調表示と先にタイプ

上記のソリューションよりも多くのソリューションがあります。最初の2つは最も知られているものと使用済みのものです。 GraphiQLは、クエリを書くのがより複雑になる可能性があるため、GraphQLチームのプロセスを簡素化するためのGraphQLチームのソリューションです。

これらの3つからGraphiQLをお勧めしますが、何よりも郵便配達員よりもお勧めします。このツールは間違いなくAPIテストの進歩です。あらゆるタイプのリクエストのコレクションを作成および保存できる直感的なインターフェイスを提供します。 APIのテストを作成して、ボタンをクリックして実行することもできます。また、共同機能があり、リクエストのコレクションを共有できます。そこで、ここからダウンロードできるものを作成しました。これを郵便配達員にインポートできます。郵便配達員がインストールされていない場合は、絶対にお勧めします。

サーバーを実行することから始めましょう。ノード4以下をインストールする必要があります。そうでない場合は、NVMを使用してインストールすることをお勧めします。その後、コマンドラインで以下を実行できます：

サーバーはリクエストを受信する準備ができたので、郵便配達員にいくつかを作成しましょう。 GraphQLルートは/graphQlに設定されているため、最初に行うことは、http：// localhost：8080/graphqlのリクエストを指示する場所に場所を設定することです。次に、GETまたはPOSTリクエストのかどうかを指定する必要があります。これらのいずれかを使用できますが、URLに影響を与えずにクリーナーにするため、投稿を好みます。また、リクエストに伴うヘッダーを構成する必要があります。この場合、Application/JSONに等しいコンテンツタイプを追加するだけです。ポストマンですべてのセットアップのように見える方法は次のとおりです

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

以下のようなJSON形式で必要なGraphQLクエリと変数を持つボディを作成できるようになりました。

私が提供したコレクションをインポートしたと仮定すると、テストできるクエリと突然変異のリクエストが既にあるはずです。ハードコーディングされたMongo IDを使用しているため、リクエストを順番に実行すると、すべて成功する必要があります。私がそれぞれの体に入れたものを分析すると、この記事で議論されているものの単なるアプリケーションであることがわかります。また、最初のリクエストを複数回実行すると、複製IDになるため、エラーの返された方法がわかります。

結論

この記事では、GraphQLの可能性と、それがRESTアーキテクチャスタイルとどのように異なるかを紹介しました。この新しいクエリ言語は、Webに大きな影響を与えるように設定されています。特に、より複雑なデータアプリケーションでは、必要なデータを正確に説明し、単一のHTTPリクエストでリクエストできるようになりました。

私はあなたから聞いてみたいです：あなたはGraphQLについてどう思いますか、そしてそれであなたの経験は何でしたか？ node.jsとmongodbを使用してGraphQL Serverを作成することに関するよくある質問 GraphQL Server用のMongoDBデータベースを設定するにはどうすればよいですか？

GraphQL ServerのMongoDBデータベースをセットアップするには、いくつかのステップが含まれます。まず、Mongodbをローカルマシンにインストールするか、Mongodb AtlasのようなクラウドベースのMongodbサービスを使用する必要があります。インストールしたら、新しいデータベースとコレクションを作成できます。その後、MongooseのようなMongoDBクライアントを使用して、node.jsアプリケーションからこのデータベースに接続できます。 Mongooseを使用すると、コレクションのスキーマを定義でき、データをクエリして操作する方法を提供します。あなたのデータとあなたがそれを実行できる操作。 node.jsアプリケーションでは、GraphQLライブラリを使用してGraphQLスキーマを定義できます。これには、データのタイプ、各タイプのフィールド、およびこれらのタイプで実行できるクエリと突然変異を定義することが含まれます。このタイプは、MongoDBコレクションのドキュメントの構造と一致する必要があります。

GraphQLサーバーのエラーを処理するにはどうすればよいですか？ Apollo Serverによる。この関数は、エラーがリゾルバーにスローされるたびに呼び出されます。引数としてエラーを受信し、エラーオブジェクトを返す必要があります。このオブジェクトには、メッセージ、ステータスコード、およびその他の関連情報を含めることができます。リゾルバーのトライ/キャッチブロックを使用して、エラーをキャッチして処理することもできます。パフォーマンスのためにGraphQLサーバーを最適化するにはどうすればよいですか？

​​

パフォーマンスのためにGraphQLサーバーを最適化する方法はいくつかあります。 1つの方法は、Dataloaderのようなライブラリでバッチとキャッシュを使用することです。これにより、MongoDBデータベースへのリクエストの数を減らし、応答時間を改善できます。別の方法は、永続的なクエリを使用することです。これにより、サーバーに送信されるリクエストのサイズが縮小できます。 Apollo Studioなどの監視ツールを使用して、パフォーマンスボトルネックを識別および修正することもできます。まず、HTTPSを使用して、クライアントとサーバー間の通信を暗号化する必要があります。ヘルメットなどのライブラリを使用して、HTTP応答にセキュリティヘッダーを追加することもできます。認証には、JSON Web Tokens（JWT）を使用し、承認のためにGraphQL-Shieldなどのライブラリを使用できます。また、インジェクション攻撃を防ぐためにユーザー入力を検証して消毒する必要があります。

GraphQLサーバーをテストするにはどうすればよいですか？エンドツーエンドテスト。 Jestのようなライブラリを使用して、テストを作成し、SuperTestのようなライブラリを使用して、HTTPリクエストをサーバーに作成できます。リソースバー、スキーマ、およびmongoDBクエリと突然変異をテストする必要があります。

GraphQLサーバーを展開するにはどうすればよいですか？ AWS、またはGoogleクラウド。また、展開プロセスを自動化するために、継続的な統合と継続的な展開（CI/CD）パイプラインを設定する必要があります。これは、GitHub ActionsやJenkinsなどのサービスを使用して実行できます。

graphqlサーバーを監視するにはどうすればよいですか？

​​

監視Apollo StudioやNew Relicなどのサービスを使用してGraphQLサーバーを実行できます。これらのサービスは、応答時間、エラー率、使用統計など、サーバーのパフォーマンスに関する洞察を提供します。また、サーバーに問題がある場合に警告することもできます。

graphqlを使用してファイルアップロードを処理するにはどうすればよいですか？

graphQl-uploadなどのライブラリを使用してファイルアップロードを実行できます。このライブラリは、スキーマで使用できるGraphQluploadスカラーと、アップロードされたファイルを処理するためにミドルウェアで使用できるプロセスリクエスト関数を提供します。 GraphQLのサブスクリプションを使用すると、クライアントにリアルタイムで更新をプッシュできます。 Subscriptions-Transport-WSなどのライブラリを使用して、サブスクリプションのWebSocket接続を処理できます。スキーマのサブスクリプションタイプを定義し、pubsub.publish and pubsub.subscribeメソッドを使用して、イベントを公開および購読することができます。

以上がnode.jsとmongodbを使用してGraphQL Serverを作成しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。