Topics covering webhook creation & management, event handling, Pub/Sub, and Eventbridge, in Shopify apps.
Hi,
I'm using remix for the application, and in the routes directory I have the webhooks file.
When using the shopify webhook testing tool it works as expected (for ORDERS_CREATE topic).
Unfortunately when creating an order in the store, the webhook doesn't run. What could be the reason for it?
Solved! Go to the solution
This is an accepted solution.
Not sure if it is documented somewhere, the solution ended up being resetting the application and reinstalling it at the store, which caused the webhooks in shopify.server.js to be registered. It seems that for each webhook removed/added this is necessary.
npm run shopify app dev -- --reset
Hey there Wappy! Happy Thursday!
I have a list of several considerations below to assist your troubleshooting and debugging in general.
Webhook Configuration: Ensure the webhook is properly configured in the Shopify admin. The webhook URL must be correct, and it should be set to listen to the ORDERS_CREATE event.
SSL Certificate: Shopify requires that the webhook endpoint is secured with a valid SSL certificate. If your endpoint does not have a valid SSL certificate, Shopify will not send the webhook.
Endpoint Accessibility: The server hosting your webhook must be publicly accessible. If it's running locally or behind a firewall, Shopify won't be able to reach it.
Request Handling: Ensure that your endpoint is correctly handling POST requests. Shopify sends data in a JSON format, and your server needs to properly parse and respond to these requests.
Shopify API Version: Make sure you are using the correct version of the Shopify API. Shopify periodically updates their API, which might affect how webhooks function.
Error Handling: Check for any errors in your server logs. If your endpoint is throwing errors, Shopify might stop sending webhooks.
Delay in Webhook Calls: Sometimes, there can be a delay in the webhook call from Shopify. It's not always instantaneous, something to note here.
Shopify Plan Limitations: Some Shopify plans have limitations on webhook usage.
Another note to mention....since you are using Remix in your application, you'll need to verify that the route handling the webhook is correctly set up and that there are no issues with the route configuration in your Remix application. These are some recommendations from trial and error I've been through before. Let me know how it goes!
Hi James, thank you for the reply.
For all I know, everything seems to be correct regarding the recommendations. I'm using the latest shopify cli template.
1- My understanding is that webhooks subscriptions are configured in shopify.server.js and handled in webhooks.js route.
This is the code in webhooks.js:
export const action = async ({ request }) => {
const { topic, shop, session, admin, payload } = await authenticate.webhook(
request
);
console.log(topic, shop, payload);
if (!admin) {
// The admin context isn't returned if the webhook fired after a shop was uninstalled.
//throw new Response({status:200});
}
switch (topic) {
case "ORDERS_PAID":
console.log(shorten_url(payload.order_status_url));
throw new Response({status:200});
break;
case "APP_UNINSTALLED":
if (session) {
return new Response("Uninstall", {status:200});
}
break;
case "CUSTOMERS_DATA_REQUEST":
if (session) {
return new Response("Customer data request", {status:200});
}
break;
case "CUSTOMERS_REDACT":
if (session) {
await deleteOrdersData(shop, payload.orders_requested);
return new Response(`Deleted orders data for ${shop}`, {status:200});
}
break;
case "SHOP_REDACT":
if (session) {
await deleteShopData(shop, ["shopify_sessions", "orders", "abandoned_carts", "shop_syncs"]);
return new Response(`Deleted shop data for ${shop}`, {status:200});
}
break;
default:
throw new Response("Unhandled webhook topic", { status: 404 });
}
throw new Response();
};
And this is shopify.server.js:
import "@shopify/shopify-app-remix/adapters/node";
import {
AppDistribution,
DeliveryMethod,
shopifyApp,
LATEST_API_VERSION,
} from "@shopify/shopify-app-remix/server";
import { restResources } from "@shopify/shopify-api/rest/admin/2023-10";
import {PostgreSQLSessionStorage} from '@shopify/shopify-app-session-storage-postgresql';
const shopify = shopifyApp({
apiKey: process.env.SHOPIFY_API_KEY,
apiSecretKey: process.env.SHOPIFY_API_SECRET || "",
apiVersion: LATEST_API_VERSION,
scopes: process.env.SCOPES?.split(","),
appUrl: process.env.SHOPIFY_APP_URL || "",
authPathPrefix: "/auth",
sessionStorage: new PostgreSQLSessionStorage(
new URL(process.env.POSTGRESESSIONURL)
),
distribution: AppDistribution.AppStore,
restResources,
webhooks: {
ORDERS_PAID: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: "/webhooks",
},
APP_UNINSTALLED: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: "/webhooks",
},
CUSTOMERS_DATA_REQUEST: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: "/webhooks",
},
CUSTOMERS_REDACT: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: "/webhooks",
},
SHOP_REDACT: {
deliveryMethod: DeliveryMethod.Http,
callbackUrl: "/webhooks",
},
},
hooks: {
afterAuth: async ({ session }) => {
shopify.registerWebhooks({ session });
},
},
future: {
v3_webhookAdminContext: true,
},
...(process.env.SHOP_CUSTOM_DOMAIN
? { customShopDomains: [process.env.SHOP_CUSTOM_DOMAIN] }
: {}),
});
export default shopify;
export const apiVersion = LATEST_API_VERSION;
export const addDocumentResponseHeaders = shopify.addDocumentResponseHeaders;
export const authenticate = shopify.authenticate;
export const unauthenticated = shopify.unauthenticated;
export const login = shopify.login;
export const registerWebhooks = shopify.registerWebhooks;
export const sessionStorage = shopify.sessionStorage;
export const scopes = shopify.scopes;
2-4 - I am able to use shopify's webhook testing tool successfully
5 - Using latest
6- no errors, as webhook isn't received
7- It never appears
8- Irrelevant
My webhooks were all failing with a Timed-out status code, I fixed it by using another SSL Certificate (I switched from manual setup using LetsEncrypt/Nginx to Cloudflare/Nginx)
This is an accepted solution.
Not sure if it is documented somewhere, the solution ended up being resetting the application and reinstalling it at the store, which caused the webhooks in shopify.server.js to be registered. It seems that for each webhook removed/added this is necessary.
npm run shopify app dev -- --reset
thanks for posting this, i reinstalled the app on my test store and it started working also