shopify app dev improperly configures webhook addresses
I followed the scaffolding app tutorial: https://shopify.dev/docs/apps/build/scaffold-app
This tutorial guides me to the next one, https://shopify.dev/docs/apps/build/build?framework=remix
When I run `shopify app deploy`, the example app works as expected, but the webhooks use the wrong endpoint.
having both guides done, I added a log to `app/routes/webhooks.js`:
import { authenticate } from "../shopify.server";
import db from "../db.server";
export const action = async ({ request }) => {
const { topic, shop, session, admin } = await authenticate.webhook(request);
concole.log("Hook received!!!")
console.log([
topic, shop, session, admin
]);
if (!admin) {
// The admin context isn't returned if the webhook fired after a shop was uninstalled.
throw new Response();
}
// The topics handled here should be declared in the shopify.app.toml.
// More info: https://shopify.dev/docs/apps/build/cli-for-apps/app-configuration
switch (topic) {
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();
};
in the config.toml, I added:
[access_scopes] # Learn more at https://shopify.dev/docs/apps/tools/cli/configuration#access_scopes scopes = "read_orders,write_products" [webhooks] api_version = "2024-07" [[webhooks.subscriptions]] topics = [ "app/uninstalled", "orders/create", "orders/fulfilled", "orders/paid" ] uri = "/webhooks"
I filled the user data request as necessary for this development app.
After `shopify app dev`, I open the store and purchase something, pay it and process it. These actions should generate webrequests to my app.
In fact, when I open the app's dashboard I see a lot of failed requests.
From the images I see that the requests were made to
`https://distant-done-cameron-protect.trycloudflare.com/webhooks`
which is an auto-generated domain name.
However, when I open the toml file, I see that the CLI has updated the urls with another address from cloudfare!
[auth] redirect_urls = [ "https://jamie-joins-ken-vulnerable.trycloudflare.com/auth/callback", # changes with every `shopify app dev` "https://jamie-joins-ken-vulnerable.trycloudflare.com/auth/shopify/callback", "https://jamie-joins-ken-vulnerable.trycloudflare.com/api/auth/callback" ]
From my understanding, the command `shopify app dev` should setup a cloudfare address and update my app's config. That config then gets pushed to shopify. And it does (see the picture)
However, the webhook addresses are somehow not updated.
can you help me ?
