DEV Community

Cover image for Integrating Apollo Studio with GraphQL for .NET - Part 3
Matt Hosking
Matt Hosking

Posted on

Integrating Apollo Studio with GraphQL for .NET - Part 3

Setting Up Apollo Studio

Now that we have code to push metrics, we need to set up Apollo Studio and get our API key. Navigate to Apollo Studio and create a free account. You'll need to add a new graph - be sure to select "Deployed" as "Development" doesn't support reporting of query metrics.
Create Graph

Uploading Your Schema

Now that we have an account and Graph, we'll need to upload our schema. The easiest way to get started is to do a manually triggered introspection of your local server:
Make sure you include "/api/graphql" in your URL. Once this is uploaded, you'll have access to a number of tabs - go to the "Schema" tab. From there, the first thing you'll need is the "Graph Ref". This is used as an input to the GraphQL trace logger we created in the earlier articles:

Creating an API Key

From the "Settings" tab, if you scroll down you can see the "API Keys" section. Create a new key (name is optional) and you'll be provided with an API key. As per usual with API keys, if you don't copy it somewhere, you won't be able to get it back and you'll have to delete the key and create a new one.
This API key is the other setting required by the trace uploader.

Using the Trace Logger

Presuming you have your background service running, all you need is to register the trace logger in a way that provides these values. You can see how this has been done in the GitHub supporting code. Since the signature for the constructor is:

ApolloReportingTraceLogger(IHttpClientFactory httpClientFactory, ISchema schema, string apiKey, string graphRef, ILogger<ApolloReportingTraceLogger> logger)
Enter fullscreen mode Exit fullscreen mode

I like to register it as follows:

services.AddSingleton<IGraphQLTraceLogger>(provider =>
  ActivatorUtilities.CreateInstance<ApolloReportingTraceLogger>(provider, Configuration["ApolloStudio:ApiKey"], Configuration["ApolloStudio:GraphRef"])
Enter fullscreen mode Exit fullscreen mode

This approach will automatically resolve IHttpClientFactory (provided you have used services.AddHttpClient()), ISchema and the ILogger from DI and use the first string as apiKey and the second as graphRef. Then all you need is the following setting in your appsettings.json file, with an override for your appsettings.Development.json for your local dev values (so you don't accidentally commit them to source, you should have the development version in .gitignore).

  "ApolloStudio": {
    "ApiKey": "",
    "GraphRef": ""
Enter fullscreen mode Exit fullscreen mode

Testing It Out!

Now that we have everything hooked up, we should be able to run a query and have it show in the Apollo Studio UI. Run your solution, and execute a query. In Apollo Studio, open the "Operations" tab and keep refreshing. After 30 seconds or so, your query should appear:
You can get general performance statistics for your queries, but the features to break down errors and drill down into resolver-level performance is reserved for the paid version. Team version (at time of writing) is USD$59/mth per user (you can have unlimited read only users for free, though), or USD$49/mth if paid annually. There's a 14 day trial, which I've used to generate resolver level stats for my sample below:

Top comments (0)