Sending a Shopify GraphQL query via HTTP request

If you're using Shopify, you can query data for your store via several API's. One of them is the Shopify GraphQL Admin API which is a great way to access only the data you need without multiple "hops" or API calls.

Shopify provide their own GraphiQL app that can be accessed via your stores admin. This is a great tool as it provides autocomplete which can help speed up the query building process and also help you learn the API faster.

Here's an example of a GraphQL query

{
  productVariant(id: "gid://shopify/ProductVariant/12345678912345") {
    sku
    sellingPlanGroups(first: 5) {
      edges {
        node {
          id
        }
      }
    }
  }
}

Which will return a json object response of

{
  "data": {
    "productVariant": {
      "sku": "sku123456",
      "sellingPlanGroups": {
        "edges": [
          {
            "node": {
              "id": "gid://shopify/SellingPlanGroup/987654321"
            }
          }
        ]
      }
    }
  },
  "extensions": {
    "cost": {
      "requestedQueryCost": 8,
      "actualQueryCost": 4,
      "throttleStatus": {
        "maximumAvailable": 2000,
        "currentlyAvailable": 1996,
        "restoreRate": 100
      }
    }
  }
}

What's great here is that you also see the cost of the query which will help you measure the impact of the query if it's going to be used in a production/background job at a high frequency. Check out Shopify's API rate limits and leaky bucket algorithm that they use.

But there's a good chance you may need to send a GraphQL query via an HTTP request from your app. Here's how you do that.

Sending a GraphQL query via a standard HTTP request

In this example we're going to send a mutation query, which will change a Shopify fulfillment status to "ON_HOLD".

{
    "query": "mutation ($fulfillmentHold: FulfillmentOrderHoldInput!, $id: ID!) { fulfillmentOrderHold(fulfillmentHold: $fulfillmentHold, id: $id) { fulfillmentOrder { id status } userErrors { field message } } }",
    "variables": {
        "fulfillmentHold": {
            "notifyMerchant": true,
            "reason": "OTHER",
            "reasonNotes": "Shopify Flow testing from Postman"
        },
        "id": "gid://shopify/FulfillmentOrder/1234567891234"
    }
}

Notice that the query is sent on one line in double quotes "". Variables are defined as separate objects.

That's it.