Why is pubSubWebhookSubscriptionCreate response data null?

Solved
buildpath
Shopify Partner
16 1 5

I'm trying to subscribe my app to Google pub/sub webhooks via graphql, using the project ID and topic.

I'm following this documentation and am using the latest release API version 2022-04.

 

The response from graphql is:

 

 

"data": {
    "pubSubWebhookSubscriptionCreate": {
      "webhookSubscription": null
    }
  }

 

 


My obviously wrong code is below. Can anyone tell me why I'm receiving a null webhookSubscription value instead of the data about the webhook I subscribed to? I changed the pub/sub project ID to "my-project-id" to protect privacy but in the actual code, I have the correct id.

 

 

import React from 'react'
import {gql, useMutation} from '@apollo/client';
import { Button, Banner } from '@shopify/polaris';
import { Loading } from '@shopify/app-bridge-react';
import { ApolloProvider, ApolloClient, InMemoryCache } from '@apollo/client';
import { useState } from 'react';

const PUB_SUB_DATA = gql`
        mutation pubSubWebhookSubscriptionCreate($topic: WebhookSubscriptionTopic!, $webhookSubscription: PubSubWebhookSubscriptionInput!) {
            pubSubWebhookSubscriptionCreate(topic: $topic, webhookSubscription: $webhookSubscription) {
              webhookSubscription {
                id
                topic
                format
                endpoint {
                  __typename
                  ... on WebhookPubSubEndpoint {
                    pubSubProject
                    pubSubTopic
                  }
                }
              }
            }
          }
      `;

    const PUB_SUB_VARIABLES = {
        variables: {
            "topic": "ORDERS_CREATE",
            "webhookSubscription": {
            "pubSubProject": "my-project-id",
            "pubSubTopic": "order_subscription_webhook",
            "format": "JSON"
            }
        }
    }



function WebhookTest() {

    const [pubSubTest, {data, loading, error}] = useMutation(PUB_SUB_DATA,PUB_SUB_VARIABLES);

    if (loading) return (
        <Loading/>
    );

    if (error) return (
        <Banner status="critical">
            There was an issue subscribing to the pub sub webhook.
        </Banner>
    );
    
    console.log(data);    

    return (
        <div>
            <Button
            primary
            onClick={pubSubTest}
          >
           Subscribe webhook
          </Button>
        </div>
    )
}

export default WebhookTest

 

 

 

Shopify merchant since 2016 | Newbie Shopify Developer focusing on marketing aspects (tracking/attribution, integrations, customizing user experience based on data, and more fun stuff)
Accepted Solution (1)

Accepted Solutions
mikedasilva
Shopify Staff
Shopify Staff
56 6 7

This is an accepted solution.

Hi,

 

It's not that pub/sub webhook subscriptions (or any type for that matter) need the scopes, it's that the topics you are trying to create these subscriptions for require certain scopes. For example, orders/update needs the read_orders whereas products/update needs read_products.

 

Yes, creating and/or retrieving subscriptions are within the context of the app for a specific shop. So, to see what subscriptions exist for a particular shop/app combination, you need to use the same token you used when you created the subscription. Using another app (such as graphiql) will not show you what subscriptions exist if they were created with a different app.

 

The new error you are seeing is because you've already created a subscription with the topic/destination combination. 

 

I'd say either use the same token to verify the list of subscriptions are what you want them to be or assume it's there because you're getting an error telling you it already exists.

 

Cheers,

mikedasilva | Developer @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

View solution in original post

Replies 5 (5)
mikedasilva
Shopify Staff
Shopify Staff
56 6 7

Hi @buildpath,

 

I'll try and help you out with this. I think you should have also received an error message in the response that you got back from the API. Can you first double check that you've inspected the full response?

 

Thanks

mikedasilva | Developer @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

buildpath
Shopify Partner
16 1 5

Hey @mikedasilva thanks for responding! I appreciated your Shopify Unite video detailing this process and maybe I missed something, but I cannot find my problem for 2 days.

 

A couple more things to add just in case the google cloud pub/sub feature isn't available to dev stores..

  • this is on a public app I'm working on
  • that app is installed on a development store in my partner account

UPDATE: Earlier today, there was no error provided in the response because I didn't ask for it in my mutation, since i just copy/pasted the mutation from the documentation. I realized I could add error handling to my graphql mutation, so I tried that as shown below:

 

 

mutation pubSubWebhookSubscriptionCreate($topic: WebhookSubscriptionTopic!, $webhookSubscription: PubSubWebhookSubscriptionInput!) {
  pubSubWebhookSubscriptionCreate(topic: $topic, webhookSubscription: $webhookSubscription) {
    webhookSubscription {
      id
      topic
      format
      endpoint {
        __typename
        ... on WebhookPubSubEndpoint {
          pubSubProject
          pubSubTopic
        }
      }
      
    }
    userErrors {
      field
      message
    }
  }
}

 

 

 

and now the data object in the graphql response at least shows an error: You cannot create a webhook subscription with the specified topic.

 

 

 "data": {
    "pubSubWebhookSubscriptionCreate": {
      "webhookSubscription": null,
      "userErrors": [
        {
          "field": [
            "webhookSubscription"
          ],
          "message": "You cannot create a webhook subscription with the specified topic"
        }
      ]
    }
  }

 

 

It seems likely that my app is somehow not properly requesting the access scopes. It is already requesting read_orders and many others. But I must be doing something wrong. I will continue to investigate and report updates in case it helps anyone else.

Shopify merchant since 2016 | Newbie Shopify Developer focusing on marketing aspects (tracking/attribution, integrations, customizing user experience based on data, and more fun stuff)
buildpath
Shopify Partner
16 1 5

@mikedasilva another update:

After adding the error handling to my mutation in the app, I get this:

 

 

[API] This action requires merchant approval for read_products scope."
┃ If you report this error, please include this id: 98978a88-0d94-4a57-bde8-75f1892dc74d

 

 

I had already confirmed the app actually does have access to read_orders and write_orders scopes. But what I didn't expect was that the pub/sub webhook request would also require access to read_products scope.

 

Now that I've added read_products to the app's access scopes, I am getting more useful information from the pubSubWebhookSubscriptionCreate mutation:

 

 

"Address for this topic has already been taken"

 

 

But when I check my-dev-store.myshopify.com/admin/api/2022-04/webhooks.json, it is empty. But I also read that webhooks are only visible to the app that created them, so I won't see them when I visit such a json file

 

 

{"webhooks":[]}

 

 

What do I do now? I'm out of ideas to investigate further...

Shopify merchant since 2016 | Newbie Shopify Developer focusing on marketing aspects (tracking/attribution, integrations, customizing user experience based on data, and more fun stuff)
mikedasilva
Shopify Staff
Shopify Staff
56 6 7

This is an accepted solution.

Hi,

 

It's not that pub/sub webhook subscriptions (or any type for that matter) need the scopes, it's that the topics you are trying to create these subscriptions for require certain scopes. For example, orders/update needs the read_orders whereas products/update needs read_products.

 

Yes, creating and/or retrieving subscriptions are within the context of the app for a specific shop. So, to see what subscriptions exist for a particular shop/app combination, you need to use the same token you used when you created the subscription. Using another app (such as graphiql) will not show you what subscriptions exist if they were created with a different app.

 

The new error you are seeing is because you've already created a subscription with the topic/destination combination. 

 

I'd say either use the same token to verify the list of subscriptions are what you want them to be or assume it's there because you're getting an error telling you it already exists.

 

Cheers,

mikedasilva | Developer @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

buildpath
Shopify Partner
16 1 5

Thanks again @mikedasilva  for your help!

 

I added this to my /auth/callback in auth.js:

const client = new Shopify.Clients.Rest(
        session.shop,
        session.accessToken
      );
      const checkWebhooks = await client.get({
        path: `admin/api/2022-04/webhooks.json`
      });
      console.log(checkWebhooks.body.webhooks);

and now in node console I can see the app is subscribed to all desired webhooks, including the pub/sub webhook.

 

Thanks again,

Ian

 

Shopify merchant since 2016 | Newbie Shopify Developer focusing on marketing aspects (tracking/attribution, integrations, customizing user experience based on data, and more fun stuff)