# n8n Webhook Test URL vs Production URL, Explained

> n8n webhook test URL vs production URL: why a form works while you test, then stops live, and the fixes for Publish, Respond and $json.body.

Source: https://learn.ynteractive.com/content/blog/n8n-webhook-test-vs-production-url · Updated 2026-10-01 · Free from Stepthrough (https://learn.ynteractive.com)

By [Robert Breen](https://learn.ynteractive.com/content/about) · Published October 1, 2026 · Updated October 1, 2026 · 6 min read

n8n · Webhooks · Troubleshooting

In n8n, the [Webhook](https://learn.ynteractive.com/content/glossary/webhook) node's [Test URL](https://learn.ynteractive.com/content/glossary/webhook-test-url-vs-production-url) only works during testing, while the Production URL is the one your [published workflow](https://learn.ynteractive.com/content/glossary/publish-workflow) uses, so a live form must point at the Production URL after you click Publish. This guide is for anyone whose form works in testing and then stops, and you can practice the fix free in the [Lovable + n8n lesson](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend).

You built a form, pointed it at an n8n webhook, and watched the row land in Google Sheets. Then a real person fills it in and nothing happens, or the form says "Thanks!" and the sheet stays empty. The cause is almost always one of a few settings on the **Webhook** node. If you haven't built the form yet, start with [Connect a Lovable Form to n8n with a Webhook](https://learn.ynteractive.com/content/blog/lovable-form-n8n-webhook). The examples here come from that lesson and the [maintenance and IT request form](https://learn.ynteractive.com/content/ai-maintenance-it-request-form-lovable-n8n) for a made-up warehouse company, Ridgeline Supply Co.

## What is the difference between the n8n test URL and production URL?

The n8n Test URL only works during testing in the editor; the Production URL is the live address your published workflow uses. Open the Webhook node and you'll see both as tabs.

When you connect a real form, the lessons have you click the **Production URL** tab and click the URL to copy it. The lesson's example production URL has this shape: `https://your-instance.app.n8n.cloud/webhook/` followed by a long ID. The two addresses look alike at a glance, so always copy from the Production URL tab.

## Why does my n8n webhook work in testing but stop working live?

The form is usually still pointing at the n8n Test URL, which stops working once you stop testing. The fix is to copy the Production URL and update the form's setting.

1. Open the **Webhook** node.
2. Click the **Production URL** tab and click the URL to copy it.
3. Paste it where the form reads it. In the lessons, that's the Lovable secret **N8N_WEBHOOK_URL**.

You don't need to rebuild the form, only update the value.

## Why doesn't my n8n webhook work at all in production?

The n8n workflow probably isn't published. The Production URL only works once the workflow is published.

That's why **Publish** comes before copying the URL in both lessons: finish the workflow (Webhook, AI Agent, tools, Respond to Webhook), click **Publish**, and only then copy the production address. In the lesson's words, once the workflow is published, the webhook URL is active and ready to receive form submissions. A saved workflow is not the same as a published one.

## Why does my form say success before the n8n workflow finishes?

The n8n Webhook node responds immediately by default, before the AI agent runs. Set **Respond** to **Using 'Respond to Webhook' Node** so the form waits for the real result.

1. Open the **Webhook** node and click the **Respond** dropdown.
2. Choose **Using 'Respond to Webhook' Node**.
3. Click the **+** on the right edge of the AI Agent and add **Respond to Webhook**. There's nothing to configure in it.

With this setup, the form only shows "Thanks! Your message has been received." after the agent has saved the row and sent the email. If something breaks, the visitor sees the friendly error ("Something went wrong. Please try again.") instead of a false thank-you.

## Why does my form show an error even though the n8n workflow ran?

The **Respond to Webhook** node is probably missing. If the Webhook is set to wait for a respond node and none exists, n8n has nothing to send back.

The lesson describes the Respond to Webhook node as what sends a success response back to the form, so the user sees a confirmation message instead of an error. The Respond setting and the Respond to Webhook node always go together.

## Try it free, step by step

**Lovable + n8n: Build a Web App with an AI Backend**. Build a contact form in Lovable and connect it to an n8n workflow — webhook trigger, AI Agent, Google Sheets, Gmail, and a Respond node that ties it all together. You do every step yourself in a practice copy of Lovable and n8n, it checks your work as you go, and “Do it for me” finishes any step you get stuck on. Free, and nothing touches your real accounts.

[Start the free lesson](https://learn.ynteractive.com/modules/lovable-n8n)

[Or read the full step-by-step guide](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend)

## Why are my n8n webhook fields blank?

Form data arrives inside the request **body**, so n8n expressions must read from `$json.body`, with keys that match what the form sends. `{{ $json.name }}` looks one level too high and finds nothing.

In the AI Agent, with **Source** set to **Define below**, the lesson's prompt template reads:

```text
Name: {{ $json.body.name }}
Email: {{ $json.body.email }}
Question: {{ $json.body.question }}
Feedback: {{ $json.body.feedback }}
```

The Lovable prompt says to send JSON with keys name, email, question, feedback, so the template uses the same names. In the operations lesson the form sends different fields, so the template uses `{{ $json.body.request }}` and `{{ $json.body.location }}` instead. [n8n Expressions for Beginners](https://learn.ynteractive.com/content/blog/n8n-expressions-for-beginners) explains `$json` and dot notation.

## Where should I store the n8n webhook URL in Lovable?

Store the n8n Production URL as a Lovable secret named **N8N_WEBHOOK_URL**, not in the page code. Then you can change the URL later without rebuilding the app.

The lesson's Lovable prompt says not to hard-code any webhook URL and to reference the N8N_WEBHOOK_URL secret instead. After publishing in n8n:

1. Copy the URL from the Webhook node's **Production URL** tab.
2. In Lovable, click **More** in the toolbar to reach the secrets settings.
3. Add a secret named **N8N_WEBHOOK_URL**, paste the URL as its value and click **Save**.

The secret name has to match what the app expects, character for character. Also remember that a Lovable app is only a preview until you publish it, so real visitors can't reach it before then.

## What does it cost to build a Lovable form with an n8n webhook?

The Stepthrough lessons are free and run on practice copies, so nothing is published, sent or billed. Building it for real needs paid-tool accounts: Lovable has free and paid plans, n8n Cloud is a paid service after a free trial (or you can self-host n8n), and the OpenAI API is pay-as-you-go and billed separately from ChatGPT.

More lessons are on the [n8n tool page](https://learn.ynteractive.com/content/tool/n8n) and under [operations](https://learn.ynteractive.com/content/industry/operations).

## Key takeaways

- The n8n Test URL only works during testing; a live form must use the Production URL.
- The n8n Production URL only works after the workflow is published, so click Publish before copying it.
- Setting Respond to "Using 'Respond to Webhook' Node" and adding a Respond to Webhook node stops the form from reporting success too early.
- Webhook form fields arrive in the request body, so n8n expressions read them as `{{ $json.body.name }}`.
- Storing the URL as the Lovable secret N8N_WEBHOOK_URL keeps it out of the page code and easy to change.

## Frequently asked questions

**What is the difference between the n8n test URL and production URL?**

The n8n Test URL only works during testing in the editor. The Production URL is the one your published workflow uses, so it's the one a live form should send to.

**Why does my n8n webhook work in testing but not live?**

The form usually still points at the Test URL, or the workflow isn't published. Publish the workflow, copy the Production URL and update the form's setting.

**Why does my form say success before the n8n workflow finishes?**

The n8n webhook responds immediately by default. Set Respond to Using 'Respond to Webhook' Node and add a Respond to Webhook node after the agent.

**Why are my n8n webhook fields empty?**

Form data arrives in the request body, so use expressions like `{{ $json.body.name }}` and make sure the keys match what the form sends.

## Free lessons in this post

- [Lovable + n8n: Build a Web App with an AI Backend](https://learn.ynteractive.com/content/lovable-n8n-web-app-ai-backend): Build a contact form in Lovable and connect it to an n8n workflow — webhook trigger, AI Agent, Google Sheets, Gmail, and a Respond node that ties it all together.
- [Build an AI Maintenance and IT Request Form](https://learn.ynteractive.com/content/ai-maintenance-it-request-form-lovable-n8n): Build an internal maintenance and IT request form in Lovable for Ridgeline Supply Co. and connect it to n8n — the AI agent sets the priority, assigns a team, saves the…

## Related terms

Plain-English definitions, each with an example from a free lesson.

[Webhook](https://learn.ynteractive.com/content/glossary/webhook) · [Test URL vs production URL](https://learn.ynteractive.com/content/glossary/webhook-test-url-vs-production-url) · [Publishing a workflow](https://learn.ynteractive.com/content/glossary/publish-workflow) · [Deployment (publishing a web app)](https://learn.ynteractive.com/content/glossary/web-app-deployment) · [Integration](https://learn.ynteractive.com/content/glossary/integration) · [No-code (and low-code)](https://learn.ynteractive.com/content/glossary/no-code) · [Request body (payload)](https://learn.ynteractive.com/content/glossary/request-body) · [Secrets and environment variables](https://learn.ynteractive.com/content/glossary/environment-variables)

[The full AI glossary](https://learn.ynteractive.com/content/glossary)

## Related prompts

- [IT and maintenance request reply prompt](https://learn.ynteractive.com/content/prompts/internal-it-request-reply-prompt): Update a coworker on their IT or maintenance request: where it stands, a workaround, when they'll hear next, and no fix time…
- [Maintenance request triage prompt](https://learn.ynteractive.com/content/prompts/maintenance-request-triage-prompt): Sort a pile of maintenance and IT requests by priority and team, with the words that drove each call quoted and vague requests…
- [Lovable web form prompt](https://learn.ynteractive.com/content/prompts/web-form-builder-prompt): Write a Lovable prompt for a web form that posts to n8n: fields, validation, button states, a thank-you message, and a webhook…
- [AI agent system message prompt](https://learn.ynteractive.com/content/prompts/agent-system-message-draft-prompt): Draft the system message for an n8n AI Agent: who it is, what it knows, its rules and how it writes, including a rule never to…

[All free prompt templates](https://learn.ynteractive.com/content/prompts)

## Visual guides

The same ideas as quick visual guides: swipe through the slides, or read each one as text.

- [Mistake to Avoid: Pasting a Webhook URL into Your Page](https://learn.ynteractive.com/content/visual/mistake-webhook-url-in-the-page): A visual tip: don't paste your n8n webhook URL into the page. Store it as a Lovable secret so it stays out of the source and is easy to change.
- [Mistake to Avoid: Testing an Unpublished n8n Workflow](https://learn.ynteractive.com/content/visual/mistake-testing-an-unpublished-workflow): A visual tip: an n8n production webhook URL only works once the workflow is published. Publish first, then copy the URL into your app.
- [What Is a Webhook? A Visual Guide](https://learn.ynteractive.com/content/visual/term-webhook-explained): A visual guide to webhooks: a web address that waits for another app to send it data, shown in a real Lovable + n8n lesson, with tips to use it safely.

[All visual guides](https://learn.ynteractive.com/content/visual)

## Keep reading

- [What Is a Webhook? A Plain-English Guide](https://learn.ynteractive.com/content/blog/what-is-a-webhook): What is a webhook? A URL that waits for data. See how a website form sends JSON to an n8n webhook, which URL to use, and where webhooks fit in a business.
- [Connect a Lovable Form to n8n with a Webhook](https://learn.ynteractive.com/content/blog/lovable-form-n8n-webhook): Lovable n8n webhook setup, step by step: send each form submission to an n8n AI agent that logs it in Google Sheets and replies by Gmail.
- [Purchase Order Follow-Up Email: Template and AI Version](https://learn.ynteractive.com/content/blog/purchase-order-follow-up-email): A purchase order follow-up email template (PO and item, the problem, one question, a reply-by date) plus an n8n agent that writes them in bulk.

[All blog posts](https://learn.ynteractive.com/content/blog) · [All free tutorials](https://learn.ynteractive.com/content)
