Hi, I am developing an application with one time purchase functionality.
But it is not triggering the webhook that I registered earlier.
Here is my code:
// shopify.server.js
const shopify = shopifyApp({
// ...
webhooks: {
APP_UNINSTALLED: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: '/webhooks'
},
APP_PURCHASES_ONE_TIME_UPDATE: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: '/webhooks'
}
}
// ...
});
// webhooks.jsx
export const action = async ({ request }) => {
const { topic, admin, session, shop, payload } = await authenticate.webhook( request );
if ( ! admin ) {
throw new Response();
}
switch ( topic ) {
case 'APP_PURCHASES_ONE_TIME_UPDATE':
console.log( 111111111111 );
break;
case 'APP_UNINSTALLED':
if ( session ) {
await db.session.deleteMany({ where: { shop } });
}
break;
case 'CUSTOMERS_DATA_REQUEST':
case 'CUSTOMERS_REDACT':
case 'SHOP_REDACT':
default:
throw new Response( 'Unhandled webhook topic', { status: 404 } );
}
throw new Response();
};
And my execute code:
// This code works
const response = await admin.graphql(
`#graphql
mutation AppPurchaseOneTimeCreate($name: String!, $price: MoneyInput!, $returnUrl: URL!, $test: Boolean!) {
appPurchaseOneTimeCreate(name: $name, test: $test, returnUrl: $returnUrl, price: $price) {
userErrors {
field
message
}
appPurchaseOneTime {
createdAt
id
name
price {
amount
currencyCode
}
status
test
}
confirmationUrl
}
}`,
{
variables: {
name: 'Blue hart',
test: true,
returnUrl: `https://admin.shopify.com/store/my-store-name`,
price: {
amount: 5,
currencyCode: 'USD'
}
}
}
);
I’ve checked my registered webhooks, but I don’t see APP_PURCHASES_ONE_TIME_UPDATE listed. Am I missing something?
Check my image
Any help would be appreciated, thanks!
I would register the webhooks in your toml file, as the is the recommended approach from the docs shopifyApp
I’ve not had any issues with webhooks being delivered this way, there is also an example of how to trigger the webhook manually at the bottom of this for easier testing
1 Like
I tried it, but it’s still not working as expected. I’m not sure what I missed.
This is my toml file:
[webhooks]
api_version = "2024-10"
[[webhooks.subscriptions]]
topics = [ "app_purchases_one_time/update" ]
uri = "/webhooks"
[pos]
embedded = false
Trigger webhook test:
Is your test webhook received and processed correctly?
You should be able to view the historic webhook deliveries in the Partner Dashboard, under monitor > insights > webhooks. To see if there were any errors.
Also could you check the user errors or request errors from your App Purchase One Time Create query, to ensure its being created properly
1 Like
Hi, I checked, and it’s completely broken.
It worked a few times before, but after deleting the app and creating a new one, it didn’t complete anything this time.
Ah okay, this means its getting a 503 response from your app.
The config-managed
webhooks will be the ones you setup from the TOML file. The ones with an ID will be the ones created by your application code before.
It means that that endpoint is returning a 503 when Shopify is trying to hit your endpoint.
Can you CURL your endpoint with a POST request?
1 Like
Hi, I tested it with CURL, and it works perfectly. It’s confusing why it doesn’t work within my app
Sorry I mean can you curl your webhook endpoint, where you have instructed Shopify to send the webhooks to.
It’s that endpoint that isn’t available and giving Shopify a 503 HTTP response.
1 Like
Hi, if I understand your hint correctly, this is the URL I need to find, right?
And new code via Postman:
curl -X POST \
https://anybody-pvc-preservation-pcs.trycloudflare.com/admin/api/2024-10/graphql.json \
-H 'Content-Type: application/json' \
-H 'X-Shopify-Access-Token: {access_token}' \
-d '{
"query": "mutation AppPurchaseOneTimeCreate($name: String!, $price: MoneyInput!, $returnUrl: URL!) { appPurchaseOneTimeCreate(name: $name, returnUrl: $returnUrl, price: $price) { userErrors { field message } appPurchaseOneTime { createdAt id } confirmationUrl } }",
"variables": {
"name": "Postman test",
"returnUrl": "https://admin.shopify.com/store/boostifydev/apps/boostify-section/app/section/product-01",
"price": {
"amount": 10,
"currencyCode": "USD"
}
}
}'
Apologies for my lack of understanding.
So in your toml file you’ve set up
[webhooks]
api_version = "2024-10"
[[webhooks.subscriptions]]
topics = [ "app_purchases_one_time/update" ]
uri = "/webhooks"
Your application url is https://anybody-pvc-preservation-pcs.trycloudflare.com
So you need to try POST to https://anybody-pvc-preservation-pcs.trycloudflare.com/webhooks
to see if that endpoint is available.
That is where Shopify is trying to send your webhooks to, if you are changing your application url, you will need to deploy your toml file again.
Shopify needs to be able to hit your application with the webhook, which you then process to your database.
Shopify is getting a 503 when trying to hit this endpoint, which means that endpoint is not avaliable.
1 Like
Thank you for your patience with my issue.
I checked as you requested, and, strangely, the endpoints are not exactly the same. I’m having a hard time understanding how they work.
The image below shows the results after I ran shopify app deploy
, then continued with shopify app dev
, and finally triggered the app_purchases_one_time/update
action.
I hope this helps you take a closer look at my issue.
Thank!