モバイルアプリのGraphQLリクエストを監視する

モバイルアプリ開発の動的な領域では、開発者は GraphQL を使用して強力で合理化されたデータ取得ツールを構築できます。しかし、GraphQL クエリの複雑さとモバイルアプリアーキテクチャの複雑化に伴い、包括的なモニタリングの必要性がさらに重要になっています。New Relic は GraphQL リクエストの監視に役立ち、次のことが可能になります。

遅延やパフォーマンス低下の原因となっているクエリを特定して最適化します。
ユーザーに影響を与える前にエラーを積極的に捕捉します。
エンドユーザーのリクエストからデータが迅速かつスムーズに読み込まれるようにします。

one.newrelic.com > All capabilities > Mobile > (select an app) > HTTP requests: 関数のカスタム名に基づいて GraphQL リクエストを表示します。

始めましょう

New Relic は、デフォルトですべての GraphQL リクエストをシームレスに監視します。ただし、明確さと分析を強化するために、GraphQL リクエストの名前を手動で構成することをお勧めします。これにより、機能に基づいてリクエストを分類し、特定のリクエストグループのパフォーマンスデータを表示できます。

各エンドポイントが個別の目的を果たす REST API とは異なり、すべての GraphQL リクエストは単一の/graphqlエンドポイントに送信されます。このため、異なるアクションを実行するリクエストを区別することが困難になります。リクエストにカスタム名を割り当てることで、GraphQL API がどのように使用されているかをより明確に理解し、特定のリクエスト機能に関連する潜在的なパフォーマンスのボトルネックを特定できます。

GraphQL リクエストにカスタム名を付けるには、次の操作を行う必要があります。

ネットワークリクエストのURLを特定します。たとえば、これは URL https://www.YOUR_MOBILE_APP.com/checkoutの顧客のチェックアウトプロセスに関連するリクエストである可能性があります。
addHTTPHeaderTracking methodを使用して、識別されたリクエストのX-APOLLO-OPERATION-NAMEヘッダーを設定します。たとえば、顧客のチェックアウトプロセスに関連するリクエストには、 checkoutという名前を付けることができます。名前は次の要件を満たす必要があります。
- 長さ: 1 ～ 1024 文字の文字列です。
- 文字: ASCII 文字のみで構成されます。

以下のプラットフォーム固有の手順に従ってください。

エージェントを開始するときに、 operationNameヘッダーを追加します。
```
[NewRelic addHTTPHeaderTrackingFor:@[@"operationName"]];
```

GraphQL HTTP リクエストヘッダーに、リクエスト URL とカスタム名を追加します。

NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL URLWithString:@"https://www.YOUR_MOBILE_APP.com/checkout"]]; // Add your request URL here.
NSMutableURLRequest *mutableRequest = [request mutableCopy];
[mutableRequest addValue:@"YOUR_CUSTOM_NAME" forHTTPHeaderField:@"operationName"]; // Add your custom name here.
request = [mutableRequest copy];
[[NSURLSession sharedSession] dataTaskWithRequest:request];

エージェントを開始するときに、 operationNameヘッダーを追加します。

List<String> headers = new ArrayList<>(); 
headers.add("operationName");
NewRelic.addHTTPHeaderTrackingFor(headers);

GraphQL HTTP リクエストヘッダーに、リクエスト URL とカスタム名を追加します。

Request request = new Request.Builder()
        .url("https://www.YOUR_MOBILE_APP.com/checkout") // Add your request URL here.
        .addHeader("operationName","YOUR_CUSTOM_NAME") // Add your custom name here.
        .build();

エージェントを開始するときに、 operationNameヘッダーを追加します。

// Add the operationName header.
        val headers = mutableListOf<String>()
        headers.add("operationName")

        NewRelic.addHTTPHeaderTrackingFor(headers);

GraphQL HTTP リクエストヘッダーに、リクエスト URL とカスタム名を追加します。

val request = Request.Builder()
    .url("https://www.YOUR_MOBILE_APP.com/checkout") // Add your request URL here.
    .addHeader("operationName", "YOUR_CUSTOM_NAME") // Add your custom name here.
    .build()

エージェントを開始するときに、 operationNameヘッダーを追加します。
```
NewRelic.addHTTPHeadersTracking(for:["operationName"])
```

GraphQL HTTP リクエストヘッダーに、リクエスト URL とカスタム名を追加します。

var request = URLRequest(url: URL(string:"https://www.YOUR_MOBILE_APP.com/checkout")!) // Add your request URL here.
request.addValue("YOUR_CUSTOM_NAME", forHTTPHeaderField: "operationName") // Add your custom name here.
URLSession.shared.dataTask(with: request)

New Relicでデータを見る

GraphQL リクエストを表示するには:

one.newrelic.com > All capabilities > Mobileに移動します。
モバイルアプリを選択します。
左側のメニューで、HTTP requestsをクリックします。
Group byドロップダウンで、Operation Nameを選択します。 HTTP リクエストページには、設定したoperationNameごとにグループ化されたすべてのリクエストが表示されます。

Screenshot of filtering requests by the operation name

GraphQL リクエストのみを表示しているので、特定のリクエストをクリックして、応答時間とネットワーク障害に関するメトリクスを表示します。

Screenshot of clicking into a specific request

この機械翻訳は、参考として提供されています。

モバイルアプリのGraphQLリクエストを監視する

始めましょう

目的-c

Java

コトリン

迅速

New Relicでデータを見る

この機械翻訳は、参考として提供されています。

モバイルアプリのGraphQLリクエストを監視する

始めましょう .css-21sua1{background:none;border:none;width:0;padding:0;}

Java

コトリン

迅速

New Relicでデータを見る

始めましょう