Shopify UPI Integration Guide: Dynamic QR + Webhook Confirmation

#shopify upi integration #shopify webhook guide #dynamic qr shopify #upi checkout shopify

This guide is for teams that want Shopify UPI checkout with cleaner order confirmation. Instead of manual proof checks, you create a pay session from backend, present dynamic QR, and confirm status with signed webhooks before fulfillment.

Architecture (recommended)

Shopify storefront triggers backend order intent.
Backend calls VyaparGateway API to create dynamic pay session.
Customer pays via UPI app using generated QR / pay flow.
Webhook callback updates order payment state in your system.

Developer integrating checkout webhooks — Keep API keys server-side; never expose webhook secrets in frontend code.

Implementation steps

Create merchant account and generate API + webhook credentials.
Build backend endpoint to create payment intent for each Shopify order.
Store order_id, amount, and payment intent mapping in your DB.
Verify X-VyaparGateway-Signature and timestamp on every webhook.
Mark order paid only after signature verification + status confirmation.

Common mistakes to avoid

Trusting client-side callback without server verification.
Skipping idempotency checks on webhook retries.
Not logging raw webhook payload + signature on failed verification.
Hard-coding API keys in theme scripts or public JS.

With this setup, teams usually reduce manual payment support tickets and shorten dispatch delays caused by pending confirmation states. If you need plugin-level implementation help, start with the developers overview and then onboard inside dashboard flows. VyaparGateway helps you issue dynamic UPI QR codes, verify payments, and notify your stack via webhooks—without charging a per-transaction platform fee on top of your plan.

Frequently asked questions

Does Shopify natively support UPI in India?

Shopify Payments is not available for UPI in India directly. You need to integrate via a third-party gateway. VyaparGateway provides a Shopify app and a custom checkout extension so you can present UPI dynamic QR alongside Shopify's default card flow without breaking the native checkout experience.

Where should I store webhook secrets — Shopify or my backend?

Always your backend. Never put the webhook signing secret in Shopify theme files, the Shopify admin metafields, or any client-side JS. Treat it like a production database password — server-side environment variable only.

What happens if a Shopify order is marked paid but the UPI webhook fails?

Your handler should be idempotent: on retry, look up the order_id, check current status, and either confirm or no-op. VyaparGateway retries failed webhooks with exponential backoff for up to 24 hours, and you can also pull payment status from the REST API as a fallback reconciliation step.

Can I use this guide for headless Shopify (Hydrogen) too?

Yes. The architecture is the same — your Hydrogen backend creates the payment intent, the customer pays via QR, and the webhook updates Shopify order status via the Storefront API. The only change is replacing Shopify-app routing with your custom Remix/Next.js endpoints.