Cómo usar: JSON Path Finder
- Paste JSON — a webhook payload from Webflow, HubSpot or Stripe, an API response, or a Make/Zapier sample output.
- Click any key or value in the tree (search helps in large payloads).
- Copy the path for the system you’re working in: JavaScript, JSONPath, jq, Python, PHP, n8n or Make.
- For Make, set the module number of the module that produced the data — the path becomes
{{3.items[2].name}}.
Why a path finder saves time
Real-world payloads are deep: a Webflow form webhook, a HubSpot contact, a Stripe event or a CMS item can be hundreds of lines of nested objects and arrays. Writing data.payload.data.items[0].fieldData.name by hand means counting brackets and guessing — and one wrong index silently returns undefined. Clicking the value gives you the exact path instantly.
Path syntax compared
| Syntax | Example | Notes |
|---|---|---|
| JavaScript | data.items[1].name | Keys with spaces use ["company name"] |
| JSONPath | $.items[1].name | Used by many APIs, Postman tests and some no-code tools |
| jq | .items[1].name | Command-line JSON processor |
| Python / PHP | data["items"][1]["name"] | Bracket access on dicts and arrays |
| n8n | {{ $json.items[1].name }} | Expression syntax in node fields |
| Make | {{1.items[2].name}} | Arrays start at 1; the first number is the module |
Make’s 1-based arrays
Everywhere else the first array item is [0]; in Make it is [1]. That’s the most common reason a mapping returns empty in Make. The tool converts indexes automatically and wraps keys that contain spaces in backticks. In Zapier, nested fields appear flattened (for example contact__email) and line items are handled as arrays — the “Zapier field key” shows the flattened form.
Need to clean the JSON first? Use the JSON Formatter. To turn arrays into tables, try JSON to CSV; for types in code, JSON to TypeScript; and for date fields in automations, the Date Format Converter.
También se busca como: json path, get json path, make mapping, n8n expression, jq path, webhook payload, json key path, json tree viewer.
Herramientas que combinan con: JSON Path Finder
- JSONPath Tester — Type a JSONPath query and instantly see what it selects — with the exact path of each match.
- Webhook Tester — Get a unique URL, point any webhook or HTTP client at it and watch requests arrive in real time — headers, query string and pretty-printed body, plus HMAC signature checks.
- API Tester — A lightweight Postman alternative in your browser: build an HTTP request, send it and inspect status, timing, headers and pretty-printed JSON.
- HubSpot Form Styler — Design your HubSpot form with a live preview — inputs, labels, two-column rows, checkboxes, error messages and the submit button — then copy the CSS, the full embed code, or a ready-made Code Embed for Webflow.
Preguntas frecuentes
Is my JSON uploaded?
Why does Make use [1] for the first item?
What is JSONPath?
$.store.books[0].title selects one value; it’s used in APIs, testing tools and some automation platforms.