バックエンド

安全なNode.jsGraphQLAPIを作成する方法

この記事では、安全なNode.js GraphQLAPIを作成する方法に関するクイックガイドを紹介することを目的としています。

頭に浮かぶかもしれないいくつかの質問は次のとおりです。

GraphQL APIを使用する目的は何ですか？
GraphQL APIとは何ですか？
GraphQLクエリとは何ですか？
GraphQLの利点は何ですか？
GraphQLはRESTよりも優れていますか？
なぜNode.jsを使用するのですか？

これらはすべて有効な質問ですが、それらに答える前に、Web開発の現在の状態の概要を簡単に説明する必要があります。

今日見られるほとんどすべてのソリューションは、ある種のアプリケーションプログラミングインターフェイス（API）を使用しています。
FacebookやInstagramなどのソーシャルネットワークを使用している場合でも、APIを使用するフロントエンドに接続されています。
興味があれば、Netflix、Spotify、YouTubeなどのサービスを含め、ほとんどすべてのオンラインエンターテインメントサービスが異なる種類のAPIを使用していることがわかります。

事実上すべてのシナリオで、詳細に知る必要のないAPIが見つかります。たとえば、APIがどのように構築されたかを知る必要はなく、以前と同じテクノロジーを使用する必要もありません。それをあなた自身のシステムに統合することができます。提供されるAPIを使用すると、特定のテクノロジースタックに依存することなく、サービスとクライアントの両方が通信できる共通の標準でサービス間で通信する方法を提供できます。

適切に構造化されたAPIを使用すると、複数の種類のクライアントとフロントエンドアプリケーションにサービスを提供できる、堅牢で保守可能でスケーラブルなAPIを使用できます。

それは言った、何です GraphQL API？

GraphQLはAPIのクエリ言語であり、Facebookで内部使用するために開発され、2015年に公開されました。読み取り、書き込み、およびリアルタイムの更新をサポートします。また、オープンソースであり、一般的にRESTや他のアーキテクチャと比較されます。一言で言えば、これは以下に基づいています。

GraphQLクエリ -これにより、クライアントはデータの受信方法を読み取って操作できます。
GraphQLミューテーション -これはサーバーにデータを書き込む方法です。これは、システムにデータを書き込む方法に関するGraphQLの規則です。

この記事は、GraphQL APIを構築して使用する方法について、シンプルでありながら実際のシナリオを示すことを目的としていますが、GraphQLの詳細な紹介は提供しません。 GraphQLチームが包括的なドキュメントを提供し、いくつかのベストプラクティスをリストしているため、理由は単純です。 GraphQLの概要。

GraphQLクエリとは何ですか？

前に説明したように、クエリは、クライアントがAPIからデータを読み取って操作できる方法です。オブジェクトのタイプを渡して、受け取るフィールドの種類を選択できます。簡単なクエリは次のようになります。

query{ users{ firstName, lastName } }

このクエリでは、ユーザーのスキーマからすべてのユーザーにリーチしようとしていますが、firstNameのみを受信していますおよびlastName。このクエリの結果は、次のようになります。

{ 'data': { 'users': [ { 'firstName': 'Marcos', 'lastName': 'Silva' }, { 'firstName': 'Paulo', 'lastName': 'Silva' } ] } }

クライアントでの使用は非常に簡単です。

GraphQL APIを使用する目的は何ですか？

APIを作成する目的は、他の外部サービスと統合できるサービスとしてソフトウェアを使用できるようにすることです。アプリケーションが単一のフロントエンドによって消費されている場合でも、このフロントエンドを外部サービスと見なすことができます。そのため、2つの間の通信がAPIを介して提供されると、さまざまなプロジェクトで作業できます。

SQLサーバーでのパフォーマンスの最適化

大規模なチームで作業する場合は、分割してフロントエンドチームとバックエンドチームを作成し、両方が同じテクノロジーを使用して作業を容易にすることができます。 APIを設計するときは、プロジェクトにより適したものと、目的のソリューションに近づくものを選択することが重要です。

この記事では、GraphQLを使用するAPIを構築するためのスケルトンに焦点を当てます。

GraphQLはRESTよりも優れていますか？

それはちょっとした取り締まりかもしれませんが、私はそれを助けることはできません： 場合によります 。

GraphQLは、いくつかのシナリオに非常によく適合するアプローチです。 RESTは、いくつかのシナリオでも実証されているアーキテクチャアプローチです。今日、一方が他方より優れている理由や、GraphQLの代わりにRESTのみを使用する必要がある理由を説明する記事がたくさんあります。また、GraphQLを内部で使用しながら、APIのエンドポイントをRESTベースのアーキテクチャとして維持できる多くの方法もあります。

最善のガイダンスは、各アプローチの利点を理解し、作成しているソリューションを分析し、チームがソリューションをどの程度快適に使用できるかを評価し、チームが学習して理解できるように指導できるかどうかを評価することです。アプローチを選択する前に高速で移動します。

この記事は、GraphQLとRESTの主観的な比較というよりも、実用的なガイドです。 2つの詳細な比較を読みたい場合は、別の記事を確認することをお勧めします。 GraphQLとREST-GraphQLチュートリアル。

ラズベリーパイに最適なウェブサーバー

今日の記事では、Node.jsを使用したGraphQLAPIの作成に焦点を当てます。

Node.jsを使用する理由

GraphQLには、使用できるいくつかの異なるライブラリがあります。この記事の目的のために、Node.jsが広く使用されていることとその事実からJavaScriptをNode.jsで使用するというアイデアを採用することにしました。 Node.jsにより、開発者はサーバー側の開発に使い慣れたフロントエンド構文を使用する。

別のApeeScapeEngineering Blogの記事で示したものと同様に、RESTベースのAPIを使用したアプローチと比較することも役立ちます。 Node.jsでの安全なRESTAPIの作成。この記事では、Node.jsの使用方法も紹介しています。 Express これら2つのアプローチの違いを比較できるスケルトンRESTAPIを開発します。 Node.jsは、スケーラブルなネットワークアプリケーション、グローバルコミュニティ、およびで見つけることができるいくつかのオープンソースライブラリを使用して設計されました。 npmのウェブサイト。

今回は、GraphQL、Node.js、Expressを使用してスケルトンAPIを構築する方法を紹介します。

GraphQLチュートリアルの実践

前に概説したように、GraphQL APIのスケルトンのアイデアを構築します。先に進む前に、Node.jsとExpressの基本を知っておく必要があります。このGraphQLの例のために作成されたプロジェクトのソースコードが利用可能ですここに。

2種類のリソースを処理します。

ユーザー、 基本的なCRUDを処理します。
製品、 そのために、GraphQLのパワーをさらに示すために少し詳しく説明します。

ユーザーには、次の構造が含まれます。

id
ファーストネーム
苗字
Eメール
パスワード
パーミッションレベル

製品には次の構造が含まれます。

id
名前
説明
価格

コーディング標準については、このプロジェクトではTypeScriptを使用します。ソースファイルでは、TypeScriptでコーディングを開始するようにすべてを構成できます。

コーディングしましょう！

まず、最新のNode.jsバージョンがインストールされていることを確認してください。公開時点では、現在のバージョンは10.15.3です。 Nodejs.org 。

プロジェクトの初期化

node-graphqlという名前の新しいフォルダから始めましょう。そこで、ターミナルまたはGit CLIコンソールを開き、次のコマンドを使用してマジックを開始できます：npm init。

依存関係とTypeScriptの構成

プロセスをスピードアップするには、package.jsonを交換しますGitリポジトリには、必要なすべての依存関係が含まれている必要があります。

{ 'name': 'node-graphql', 'version': '1.0.0', 'description': '', 'main': 'dist/index.js', 'scripts': { 'tsc': 'tsc', 'start': 'npm run tsc && node ./build/app.js' }, 'author': '', 'license': 'ISC', 'dependencies': { '@types/express': '^4.16.1', '@types/express-graphql': '^0.6.2', '@types/graphql': '^14.0.7', 'express': '^4.16.4', 'express-graphql': '^0.7.1', 'graphql': '^14.1.1', 'graphql-tools': '^4.0.4' }, 'devDependencies': { 'tslint': '^5.14.0', 'typescript': '^3.3.4000' } }

更新されたpackage.jsonで、もう一度ターミナルを押して、npm installを使用します。 Node.jsおよびExpress内でこのGraphQLAPIを実行するために必要なすべての依存関係をインストールします。

次の部分は、TypeScriptモードを構成することです。 tsconfig.jsonというファイルが必要です次のルートフォルダにあります。

{ 'compilerOptions': { 'target': 'ES2016', 'module': 'commonjs', 'outDir': './build', 'strict': true, 'esModuleInterop': true } }

この構成のコードのロジックは、appフォルダーにあります。そこでapp.tsを作成できますファイルと基本的なテストのために、そこに次のコードを追加します。

console.log('Hello Graphql Node API tutorial');

構成により、npm startを実行できるようになりました。ビルドを待ち、すべてが正しく機能していることをテストできるようにします。ターミナルコンソールに、「Hello GraphQL NodeAPIチュートリアル」が表示されます。バックシーンでは、構成は基本的にTypeScriptコードを純粋なJavaScriptにコンパイルしてから、buildでビルドを実行します。フォルダ。

それでは、GraphQLAPIの基本的なスケルトンを構成しましょう。プロジェクトを開始するために、3つの基本的なインポートを追加します。

Express
Express-graphql
Graphql-ツール

すべてをまとめ始めましょう。

import express from 'express'; import graphqlHTTP from 'express-graphql'; import {makeExecutableSchema} from 'graphql-tools';

これで、少しコーディングを開始できるはずです。次のステップは、Expressでアプリを処理し、次のような基本的なGraphQL構成を処理することです。

import express from 'express'; import graphqlHTTP from 'express-graphql'; import {makeExecutableSchema} from 'graphql-tools'; const app: express.Application = express(); const port = 3000; let typeDefs: any = [` type Query { hello: String } type Mutation { hello(message: String) : String } `]; let helloMessage: String = 'World!'; let resolvers = { Query: { hello: () => helloMessage }, Mutation: { hello: (_: any, helloData: any) => { helloMessage = helloData.message; return helloMessage; } } }; app.use( '/graphql', graphqlHTTP({ schema: makeExecutableSchema({typeDefs, resolvers}), graphiql: true }) ); app.listen(port, () => console.log(`Node Graphql API listening on port ${port}!`));

私たちがしていることは：

Expressサーバーアプリのポート3000を有効にします。
簡単な例として使用するクエリとミューテーションを定義します。
クエリとミューテーションがどのように機能するかを定義します。

OK、でもtypeDefとリゾルバー、そしてクエリとミューテーションとの関係はどうなっているのでしょうか？

typeDefs -クエリとミューテーションから期待できるスキーマの定義。
リゾルバ -フィールドや必須パラメーターの期待値の代わりに、ここでは、クエリとミューテーションがどのように機能するかについての関数と動作を定義します。
クエリ -サーバーから読み取りたい「gets」。
突然変異 -独自のサーバーにあるデータに影響を与えるリクエスト。

さあ、走りましょう 海抜スタート もう一度、そこに何があるかを確認します。アプリは次のメッセージで実行されると予想されます。ポート3000でリッスンしているNodeGraphql API！

これで、次の方法で独自のサーバーでGraphQLAPIのクエリとテストを試みることができます。 http：// localhost：3000 / graphql

GraphQLチュートリアル：サーバーテスト

これで、「こんにちは」として定義された最初の独自のクエリを作成できます。

C ++またはCを学ぶ

GraphQLチュートリアル：最初のクエリ

typeDefsで定義した方法で、このページはクエリの作成に役立つことに注意してください。

それは素晴らしいことですが、どうすれば値を変更できますか？突然変異！

それでは、メモリ内の値をミューテーションで変更するとどうなるか見てみましょう。

GraphQLチュートリアル：突然変異のデモストレーション

諮問委員会メンバーへの報酬

これで、GraphQL Node.jsAPIを使用して基本的なCRUD操作を実行できます。それでは、コードを進めましょう。

製品

製品については、productsというモジュールを使用します。この記事を簡略化するために、デモンストレーションのためだけにインメモリデータベースを使用します。製品を管理するためのモデルとサービスを定義します。

私たちのモデルは次のように基づいています：

export class Product { private id: Number = 0; private name: String = ''; private description: String = ''; private price: Number = 0; constructor(productId: Number, productName: String, productDescription: String, price: Number) { this.id = productId; this.name = productName; this.description = productDescription; this.price = price; } }

GraphQLと通信するサービスは、次のように定義されます。

export class ProductsService { public products: any = []; configTypeDefs() { let typeDefs = ` type Product { name: String, description: String, id: Int, price: Int } `; typeDefs += ` extend type Query { products: [Product] } `; typeDefs += ` extend type Mutation { product(name:String, id:Int, description: String, price: Int): Product! }`; return typeDefs; } configResolvers(resolvers: any) { resolvers.Query.products = () => { return this.products; }; resolvers.Mutation.product = (_: any, product: any) => { this.products.push(product); return product; }; } }

ユーザー

ユーザーの場合、製品モジュールと同じ構造に従います。ユーザー向けのモデルとサービスをご用意します。モデルは次のように定義されます。

export class User { private id: Number = 0; private firstName: String = ''; private lastName: String = ''; private email: String = ''; private password: String = ''; private permissionLevel: Number = 1; constructor(id: Number, firstName: String, lastName: String, email: String, password: String, permissionLevel: Number) { this.id = id; this.firstName = firstName; this.lastName = lastName; this.email = email; this.password = password; this.permissionLevel = permissionLevel; } }

その間、私たちのサービスは次のようになります：

const crypto = require('crypto'); export class UsersService { public users: any = []; configTypeDefs() { let typeDefs = ` type User { firstName: String, lastName: String, id: Int, password: String, permissionLevel: Int, email: String } `; typeDefs += ` extend type Query { users: [User] } `; typeDefs += ` extend type Mutation { user(firstName:String, lastName: String, password: String, permissionLevel: Int, email: String, id:Int): User! }`; return typeDefs; } configResolvers(resolvers: any) { resolvers.Query.users = () => { return this.users; }; resolvers.Mutation.user = (_: any, user: any) => { let salt = crypto.randomBytes(16).toString('base64'); let hash = crypto.createHmac('sha512', salt).update(user.password).digest('base64'); user.password = hash; this.users.push(user); return user; }; } }

念のため、ソースコードはこちらから使用できますリンク。

これで、コードを再生してテストできます。 npm startを実行しましょう。サーバーはポート3000で実行されます。これで、GraphQLにアクセスしてテストできます。 http：// localhost：3000 / graphql 。

ミューテーションを試して、商品リストにアイテムを追加してみましょう。

Node.jsGraphQLミューテーションデモストレーション

それが機能するかどうかをテストするために、製品のクエリを使用しますが、受信するのはid、name、およびpriceのみです。

query{ products{ id, name, price } } The response will be: { 'data': { 'products': [ { 'id': 100, 'name': 'My amazing product', 'price': 400 } ] } }

以上です;製品は期待どおりに機能しています。これで、必要に応じてフィールドを再生したり切り替えたりできます。説明を追加してみてください。

query{ products{ id, name, description, price } }

これで、製品の説明を取得できます。今すぐユーザーを試してみましょう。

mutation{ user(id:200, firstName:'Marcos', lastName:'Silva', password:'amaz1ingP4ss', permissionLevel:9, email:' [email protected] ') { id } }

そして、クエリは次のようになります。

query{ users{ id, firstName, lastName, password, email } }

次のような応答で：

{ 'data': { 'users': [ { 'id': 200, 'firstName': 'Marcos', 'lastName': 'Silva', 'password': 'kpj6Mq0tGChGbZ+BT9Nw6RMCLReZEPPyBCaUS3X23lZwCCp1Ogb94/oqJlya0xOBdgEbUwqRSuZRjZGhCzLdeQ==', 'email': ' [email protected] ' } ] } }

これで、GraphQLスケルトンの準備が整いました。ここから、便利で完全に機能するAPIに向けて多くのステップがありますが、基本的なコアが設定されました。

まとめと最終的な考え

短縮するための最先端であっても、この記事は非常に大きく、GraphQL Node.jsAPIの開発に関する基本的な情報がたくさんあります。

これまでに取り上げた内容を確認しましょう。

ExpressおよびGraphQLでNode.jsを使用してGraphQLAPIを構築します。
基本的なGraphQLの使用;
クエリとミューテーションの基本的な使用法。
プロジェクトのモジュールを作成するための基本的なアプローチ。
GraphQLAPIをテストします。

物事の開発面にさらに焦点を合わせるために、以下のように簡単に要約できるいくつかの重要な項目を避けました。

新しいアイテムの検証。
一般的なエラーサービスでエラーを適切に処理します。
汎用サービスを使用して、ユーザーが各リクエストで使用できるフィールドを検証します。
APIを保護するためにJWTインターセプターを追加します。
より効果的なアプローチでパスワードハッシュを処理します。
ユニットテストと統合テストを追加します。

このGitには完全なソースコードがあることを忘れないでくださいリンク。気軽に使用、フォーク、未解決の問題、プルリクエストの作成、そしてそれで遊んでください！この記事で行われたすべての基準と提案が石に刻まれているわけではないことに注意してください。

これは、独自のGraphQLAPIの設計を開始するために使用できる多くのアプローチの1つにすぎません。また、GraphQLをより詳細に読んで探索し、GraphQLが提供するものと、APIをさらに改善する方法を学習してください。

VisualStudioビルドiOSアプリ

基本を理解する

GraphQLは言語ですか？

GraphQLは、クライアントAPIおよびそれらのクエリを実行するサーバー側ランタイムのクエリ言語として定義されています。とはいえ、GraphQLは正確には言語ではありませんが、独自の構文があり、Node.jsなどのいくつかのプログラミング言語内で開発できます。

GraphQLの利点は何ですか？

GraphQLは、要求を行い、クライアントが実際に消費する必要があるものをフィルタリングするためにクライアントの使用を簡素化し、サーバー側からクライアント側に余分なデータが渡されるのを防ぎます。これはRESTの優れた代替手段ですが、RESTとともに使用することもできます。

Node.jsとは正確には何ですか？

Node.jsは、JavaScript構文を使用してバックエンドサーバーを開発できるようにするクロスプラットフォームのJavaScriptランタイム環境です。ソフトウェアエンジニアがバックエンド（node.js）とフロントエンド（AngularやReactなど）の両方でJavaScriptを使用してコーディングできる場合、開発速度を向上させることができます。