--- schema_version: "1" id: 8922e0c54e94e43df3cb69d7b15b4339447595145dedc57c365a44ae00a04c87 title: GraphQL プロジェクトをテストする collection: mulesoft version: current locale: ja-jp portal_url: https://docs.salesforce.com/mulesoft/current/ja-jp/anypoint-code-builder/tut-graphql-test-first-implementation.md canonical_url: https://docs.mulesoft.com/jp/anypoint-code-builder/tut-graphql-test-first-implementation source_site: docs.mulesoft.com content_type: documentation content_hash: 6e0787891626a9ac8709ab1d0bdf283b4622ba78a7952acf1121b65d76894983 description: MuleSoft Documentation Site latest: true --- # GraphQL プロジェクトをテストする **進行中のベータリリース**​: **クラウド IDE は進行中のベータリリースです**​。ベータ状態での Anypoint Code Builder の使用には、IDE で入手できる、該当するベータサービス契約条件が適用されます。 GraphQL プロジェクトを変更する前に、アプリケーションを IDE 内でローカルで実行してエンドポイントをテストします。 ## [](#始める前に)始める前に [GraphQL API の実装](https://docs.mulesoft.com/jp/anypoint-code-builder/tut-graphql-implement-api)を完了します。 ## [](#アプリケーションを実行する)アプリケーションを実行する Mule アプリケーションを IDE 内でローカルにデプロイするには、Anypoint Code Builder でデバッグセッションを実行します。 1. Anypoint Code Builder で ​**\[Books Implementation (ブック実装)\]**​ プロジェクトを開きます。 2. アクティビティバーの ​![](/mulesoft/current/ja-jp/anypoint-code-builder/_images/icon-run-debug.png)​ (​**\[Run and Debug (実行およびデバッグ)\]**​) アイコンをクリックし、​**\[Start Debugging (F5) (デバッグを開始 (F5))\]**​ アイコンをクリックします。 3. IDE から、コンソールのターミナルウィンドウを開きます。 - デスクトップ IDE で、​**\[View (表示)\]**​ > ​**\[Terminal (ターミナル)\]**​ を選択する。 - クラウド IDE で、​![](/mulesoft/current/ja-jp/anypoint-code-builder/_images/icon-menu.png)​ (メニュー) アイコンをクリックし、​**\[Terminal (ターミナル)\]**​ > ​**\[New Terminal (新規ターミナル)\]**​ を選択する。 - いずれかの IDE で、Ctrl キーを押してからバッククォートキー (\`) を押す。 4. ターミナルで、プラス (​**+**​) アイコンをクリックして新しいコマンドプロンプトを開きます。次に例を示します。 ![ターミナルからコマンドプロンプトを開く](/mulesoft/current/ja-jp/anypoint-code-builder/_images/open-command-prompt.png) または、プラス (​**+**​) アイコンの横にある ​**v**​ メニュー (逆キャレット) をクリックして、使用するコマンドシェル (​**bash**​ など) を選択します。 ![ターミナルから bash プロンプトを開く](/mulesoft/current/ja-jp/anypoint-code-builder/_images/open-command-prompt-bash.png) 5. シェルのプロンプトから次の ​`curl`​ コマンドを実行して、​**bookById**​ フローをトリガーします。 ```curl curl --request POST \ --location 'http://localhost:8081/graphql' \ --header 'Content-Type: application/json' \ --data '{ "query": "query bookById($id: ID) {bookById(id: $id){ id name pageCount author{ id firstName lastName}}}", "variables": { "id": 1 } }' ``` エラー​`「curl: (7) Failed to connect to localhost port 8081 after 0 ms: Couldn’t connect to server (curl: (7) ローカルホストポート 8081 に接続できませんでした (0 ms 経過): サーバーに接続できませんでした)」`​が発生したら、アプリケーションを停止して、デバッグモードで再実行します。アプリケーションの停止に関する指針は、[Mule アプリケーションのデバッグ](https://docs.mulesoft.com/jp/anypoint-code-builder/int-debug-mule-apps)を参照してください。
Postman などのツールでは、GraphQL クエリをビルドする方法が提供されます。たとえば、Postman では、クエリを ​[Body (本文)]​ タブに配置して、​curl​ 要求のコードスニペットを見つけることができます。結果のコマンドには、​curl​ コマンドの ​--data​ 値から削除できる改行 (​\\n​) とタブ (​\\t​) 文字が含まれます。詳細は、Postman ドキュメントの 「Make an HTTP call with GraphQL (GraphQL を使用した HTTP コールの実行)」​を参照してください。
Anypoint Code Builder からターミナルに次の出力が返されます (読みやすくするために手動で再書式設定)。 ```GraphQL { "data": { "bookById": { "id":"#myID", "name":"This is some example data", "pageCount":100, "author": { "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "firstName":"This is some example data", "lastName":"Hello World!" } } } } ``` 出力のモックデータは、​**Query.bookById**​ フロー (​``​) に含まれる Set Payload コンポーネントの文字列から取得されます。 ```xml ``` 6. 必要に応じて、他のエンドポイントのクエリを試します。 1. 次の ​`curl`​ コマンドを使用して ​`books`​ エンドポイントを照会します。 ```command curl --location 'http://localhost:8081/graphql' \ --header 'Content-Type: application/json' \ --data '{"query":"query books { books{ id name pageCount author{ id firstName lastName } }}","variables":{}}' ``` このコマンドでは、次の結果が返されます (読みやすくするために手動で再書式設定)。 { "data": { "books": \[{ "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "name":"This is some example data", "pageCount":1, "author": { "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "firstName":"This is some example data", "lastName":"Hello World!" } }\] } } 参考までに、​`books`​ エンドポイントは次のような構造になります。 ```GraphQL query books { books{ id name pageCount author{ id firstName lastName } } } ``` 2. Query ​`bestSellers`​: ```command curl --location 'http://localhost:8081/graphql' \ --header 'Content-Type: application/json' \ --data '{"query":"query bestsellers { bestsellers{ books{ id name pageCount author{ id firstName lastName } } authors{ id firstName lastName } } }","variables":{}}' ``` このコマンドでは、次の結果が返されます (読みやすくするために手動で再書式設定)。 { "data" : { "bestsellers": { "books": \[{ "id":"#myID", "name":"This is some example data", "pageCount":1, "author": { "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "firstName":"This is some example data", "lastName":"Hello World!" } }, { "id":"some-id", "name":"Goodbye", "pageCount":100, "author": { "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "firstName":"This is some example data", "lastName":"Hello World!" } }, { "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "name":"Hello World!", "pageCount":-10, "author": { "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "firstName":"This is some example data", "lastName":"Hello World!" } }\], "authors": \[{ "id":"urn:uuid:123e4567-e89b-12d3-a456-426655440000", "firstName":"Hello World!", "lastName":"Hello World!" }, { "id":"#myID", "firstName":"Goodbye", "lastName":"Goodbye" }\] } } } 参考までに、​`bestsellers`​ エンドポイントは次のような構造になります。 ```GraphQL query bestsellers { bestsellers{ books{ id name pageCount author{ id firstName lastName } } authors{ id firstName lastName } } } ``` 7. [GraphQL 実装の応答の設定](https://docs.mulesoft.com/jp/anypoint-code-builder/tut-graphql-configure-flow-responses)に進み、各フローに各クエリのカスタム応答を入力します。