Fresh Remix app with 100% failure rate for webhooks in admin but cli webhooks work

Hi all, I’m at my wits’ end trying to work this out and successfully subscribe to the customers/update webhook in my dev environment. Here’s what I’m doing so far with the CLI version 3.69.4:

  1. $ shopify app init
  2. Edit shopify.app.toml to include the scopes and webhook subscriptions I need (file contents pasted below)
  3. Open partner dashboard and request customer protected data access
  4. Create new webhook route @ /app/routes/webhooks.customers.update.jsx
  5. $ shopify app deploy
  6. $ shopify app dev and choose enable URL updates, press “p” and install the app
  7. $ shopify app webhook trigger and select customers/update then input my URL using https://subdomain-from-toml-file.trycloudflare.com/webhooks/customers/update
  8. CLI reports success and my console logs everything as expected (with dummy customer data)
  9. Note that I don’t have any webhooks configured in my admin when doing this
  10. When I actually update a customer using the admin, I don’t see anything in my console log; the partner dashboard insights show me 100% webhook delivery failure with multiple 503 or 530 errors.
  11. If I then create a webhook in the admin for customers/update using my URL https://subdomain-from-toml-file.trycloudflare.com/webhooks/customers/update and “Send test” from the admin then I see the first line of my template file (the console.log()) and nothing else
  12. If I update an actual customer via the admin with the admin webhook active then I get the same result (the console.log()) and nothing else

Here’s my shopify.app.toml file contents:

# Learn more about configuring your app at https://shopify.dev/docs/apps/tools/cli/configuration

client_id = "012345678909876543210"
name = "Latest Test"
handle = "latest-test-1337"
application_url = "https://my-latest-autoupdated-subdomain.trycloudflare.com"
embedded = true

[access_scopes]
# Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes
scopes = "write_products,customer_read_customers,read_customers"

[auth]
redirect_urls = [
  "https://my-latest-autoupdated-subdomain.trycloudflare.com/auth/callback",
  "https://my-latest-autoupdated-subdomain.trycloudflare.com/auth/shopify/callback",
  "https://my-latest-autoupdated-subdomain.trycloudflare.com/api/auth/callback"
]

[webhooks]
api_version = "2024-10"

  [[webhooks.subscriptions]]
  topics = [ "app/uninstalled" ]
  uri = "/webhooks/app/uninstalled"

  [[webhooks.subscriptions]]
  topics = [ "app/scopes_update" ]
  uri = "/webhooks/app/scopes_update"

  [[webhooks.subscriptions]]
  topics = [ "customers/update" ]
  uri = "/webhooks/customers/update"

[pos]
embedded = false

[build]
include_config_on_deploy = true
dev_store_url = "my-app-playground.myshopify.com"
automatically_update_urls_on_dev = true

And here’s my /app/routs/webhooks.customers.update.jsx:

import { authenticate } from "../shopify.server";

export const action = async ({ request }) => {
  console.log('webhooks.customers.update');
  // Everything after this first console.log() ONLY works
  // with a CLI webhook trigger; editing customers
  // in the admin does not trigger anything below this
  const { payload, topic, shop } = await authenticate.webhook(request);

  console.log(`Received ${topic} webhook for ${shop}`);
  console.log(`Payload`, payload);

  return new Response();
};

Please let me know if there’s any other info I can provide so that I can get this up webhook request authenticated for actual admin actions.

so your issue is that you are unable to see your console log whenever webhook is triggered. you can run

shopify app dev -- --reset 

then redownload and install your app on dev store or store hope this helps

Thanks, tried that multiple times and nothing changes.

The problem is that, it is printing, the dev terminal doesnt update the console whenever in dev mode, what you can do is to deploy your app to production, host it on heroku then can check the heroku logs within your apps to handle the webhooks

When every time ‘application_url’ changes, it is necessary to re execute ‘shopify app dev’ and ‘shopify app deploy’,
The steps are as follows
1.shopify app dev
2.shopify app deploy
3.shopify app dev

Tried this, same problem. The first console.log() runs but nothing afterwards which I believe means this is an authentication issue.

I moved my webhook subscriptions into /app/shopify.server.js and now everything works as expected:

import "@shopify/shopify-app-remix/adapters/node";
import {
  ApiVersion,
  AppDistribution,
  DeliveryMethod,
  shopifyApp,
} from "@shopify/shopify-app-remix/server";
import { PrismaSessionStorage } from "@shopify/shopify-app-session-storage-prisma";
import prisma from "./db.server";

const shopify = shopifyApp({
  apiKey: process.env.SHOPIFY_API_KEY,
  apiSecretKey: process.env.SHOPIFY_API_SECRET || "",
  apiVersion: ApiVersion.October24,
  scopes: process.env.SCOPES?.split(","),
  appUrl: process.env.SHOPIFY_APP_URL || "",
  authPathPrefix: "/auth",
  sessionStorage: new PrismaSessionStorage(prisma),
  distribution: AppDistribution.AppStore,
  webhooks: {
    CUSTOMERS_UPDATE: {
      deliveryMethod: DeliveryMethod.Http,
      callbackUrl: "/webhooks/customers/update",
    },
  },
  hooks: {
    afterAuth: async ({ session }) => {
      shopify.registerWebhooks({ session });
    },
  },
  future: {
    unstable_newEmbeddedAuthStrategy: true,
    removeRest: true,
  },
  ...(process.env.SHOP_CUSTOM_DOMAIN
    ? { customShopDomains: [process.env.SHOP_CUSTOM_DOMAIN] }
    : {}),
});

export default shopify;
export const apiVersion = ApiVersion.October24;
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;
1 Like

I just wanted to add some additional checks for anyone running into this issue. I have figured out this issue by querying webhooksSubscriptions in GraphqlQL admin (here is the link for the query: (webhookSubscriptions - GraphQL Admin), you check the response and check __typename: ‘webhookhttpendpoint’, “callbackUrl”: “https://pt-galleries-engineer-bind.trycloudflare.com/webhooks/orders/create”, is the same url being used in your partner dashboard- click on configuration and find: app url: ‘https://pt-galleries-engineer-bind.trycloudflare.com’ and, your shopify.app.toml application_url:‘https://pt-galleries-engineer-bind.trycloudflare.com’. Next you verify the uri for the webhooks and ensure they are pointing to the route to whichever file your trying to send the data to for example mine is /webhooks/orders/create. Now my problem was the callbackUrl in the graphql was an outdated cloudflare url that I used a couple days ago. Therefore I made a new graphql query webhookSubscriptionUpdate(webhookSubscriptionUpdate - GraphQL Admin) and updated the callback url with the current cloudflare callbackurl that Im using. I then tested it using my development store and placed an order with dummy data and got a success. I have also learned that in the admin page settings/notifications/ Send test does not send a success payload but does hit the endpoint.