Workflow WebhooksWorkflow Webhooks

How to connect Vercel to Shopify Flow

Vercel sends a webhook when a deployment is created, succeeds, fails, or when a project or domain changes. Workflow Webhooks turns that call into a Shopify Flow trigger, so your store can react to it: tag a customer, add an order note, send an internal email, update a metafield - anything Shopify Flow can do.

This guide sets up the whole path - Vercel sends, Workflow Webhooks receives and verifies, Shopify Flow acts - with Vercel's HMAC signature checked on every request, so nothing but Vercel can start your workflow.

What you can build

  • Email your team when a headless storefront deployment fails.
  • Write the live deployment id into a shop metafield after every successful deploy.
  • Start a cache-warming or re-index workflow once a deployment is ready.

Typical events to send: deployment.succeeded, deployment.error, project.created.

Before you begin

  • Workflow Webhooks installed on your Shopify store.
  • Shopify Flow installed, which is free from the Shopify App Store.
  • An account on Vercel with permission to create webhooks.

Step 1 - Create the webhook in Workflow Webhooks

  1. Open Workflow Webhooks -> Webhooks -> Create webhook and give it a name you will recognise in Flow, such as Vercel events.
  2. Under Authentication, choose HMAC.
  3. Under Signature provider, pick Vercel. The app fills in the header, algorithm, signed payload and replay window for you - there is nothing else to configure.
  4. Leave the secret empty for now and Save. Copy the webhook URL shown on the page.

See Authentication for the other authentication modes, and Payload mapping and Flow variables for choosing which fields reach Flow.

Step 2 - Add the endpoint in Vercel

In Vercel, open Settings -> Webhooks for the team or project, create a webhook with the URL you copied, and copy the secret it shows you.

How to find your Vercel signing secret

The webhook secret shown when you created the webhook (or the integration's client secret).

Vercel's own documentation on webhook signatures has the exact wording and screenshots for your account.

Paste that secret into the webhook's Secret field in Workflow Webhooks and save. From that moment every Vercel delivery is verified before it reaches Flow.

What this checks

What Value
Signature header x-vercel-signature
Where the signature sits The whole header value
What is signed {body}
Signature HMAC-SHA1, hex encoded
Timestamp Not used by this sender
Replay protection None - this sender does not sign a timestamp, so every valid signature stays valid
The secret Used as plain text. Paste it exactly as the sender shows it

In the signed payload, {body} is the raw request body, byte for byte.

A request that fails any of these is rejected with 401, is recorded in History and troubleshooting, and never starts a workflow.

Step 3 - Build the Shopify Flow workflow

  1. In Shopify Flow, create a workflow and choose the Workflow Webhooks trigger.
  2. Press Record events, then send a test event from Vercel (or use Send test in Workflow Webhooks) so Flow learns the shape of your data.
  3. Every webhook you own fires the same Flow trigger, so add a first condition on the webhook id to keep this workflow to Vercel only. The id is shown on the webhook page.
  4. Add your actions - tag a customer, add a note, send an internal email, update a metafield.

Step 4 - Test it end to end

Trigger a real event in Vercel. In Workflow Webhooks -> History you should see the invocation with status Success. If the signature was wrong you get a failed entry with the reason instead, and Verifying signed webhooks explains the signature tester that shows you exactly which step failed.

The signature does not match▾

In this order: the secret (the most common cause - an extra space, or a key from the wrong environment), whether the sender is using a different endpoint's secret, and whether anything between Vercel and the app rewrites the body. Signatures cover the raw bytes, so a proxy that re-formats JSON breaks them. The signature tester on the webhook page shows the exact text that was signed.

I get 401 on every request▾

Check that the webhook's authentication is set to HMAC with the Vercel provider selected, that the secret is filled in, and that Vercel is posting to the URL exactly as the app shows it, including the code at the end.

Nothing appears in History▾

The request never arrived. Re-check the URL in Vercel, and look at Vercel's own delivery log for the response it got. A 404 means a wrong or deleted webhook, a 429 means you are over your plan's invocation limit - see Plans and usage.

The workflow runs for the wrong events▾

Every webhook in your store fires the same Flow trigger. Add a condition on the webhook id as the first step of the workflow, or narrow the events you send from Vercel.