skip to Main Content

I have started building an application on shopify-app-remix. I cannot set up an order to create a webhook on this package. I have tried the below code to fire a webhook when an order is made. when i run the application with npm run dev that time in command prompt i can see only "app uninstaller".

In the shopify.server.js file:-

import "@shopify/shopify-app-remix/adapters/node";
import {
  AppDistribution,
  DeliveryMethod,
  shopifyApp,
  LATEST_API_VERSION,
} from "@shopify/shopify-app-remix/server";
import { PrismaSessionStorage } from "@shopify/shopify-app-session-storage-prisma";
import { restResources } from "@shopify/shopify-api/rest/admin/2023-07";

import prisma from "./db.server";

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 PrismaSessionStorage(prisma),
  distribution: AppDistribution.AppStore,
  restResources,
  webhooks: {
    APP_UNINSTALLED: {
      deliveryMethod: DeliveryMethod.Http,
      callbackUrl: "/webhooks",
    },
    ORDERS_CREATE: {
      deliveryMethod: DeliveryMethod.Http,
      callbackUrl: "/webhooks",
    },
  },
  hooks: {
    afterAuth: async ({ session }) => {
      shopify.registerWebhooks({ session });
    },
  },
  ...(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;

In the webhooks.jsx file:-

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

export const action = async ({ request }) => {
  const { topic, shop, session } = await authenticate.webhook(request);

  switch (topic) {
    case "APP_UNINSTALLED":
      if (session) {
        await db.session.deleteMany({ where: { shop } });
      }
      break;
    case "CUSTOMERS_DATA_REQUEST":
    case "CUSTOMERS_REDACT":
    case "SHOP_REDACT":
    case "ORDERS_CREATE": console.log(' Order create webhook run'); break;
    default:
      throw new Response("Unhandled webhook topic", { status: 404 });
  }

  throw new Response();
};

2

Answers


  1. Assuming you are using the latest Shopify Boiler plate produced by the CLI.

    Additional webhooks are created on the initial install. Even if it was correctly installed, relying on this isn’t advised.

    In the long run, you’ll want to develop methods to add the webhooks yourself.

    • What if your app grows and you require more webhooks
    • What if your app crashed and Shopify removed your webhooks.

    Here is the official documentation https://github.com/Shopify/shopify-api-js/blob/main/docs/guides/webhooks.md

    Login or Signup to reply.
  2. correct name for order/create webhook is ORDER_TRANSACTIONS_CREATE

    According to this documentation.

    https://shopify.dev/docs/api/admin-graphql/2023-07/enums/WebhookSubscriptionTopic

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search