Mock API Response Generator: The Whole Response, Not Just the Body
Testing code that reads response headers, checks status codes, or handles error envelopes needs more than a JSON body to mock against — it needs a full response. This tool generates a complete mock HTTP response (status line, headers, body) from an example JSON shape, switching to a generic error envelope automatically when you select a 4xx or 5xx status.
Selecting an error status code (400+) swaps the body for a generic { error: { code, message } } shape instead of your example's structure.
Why Headers Matter for Realistic Mocking
Frontend code that reads `content-type` to decide how to parse a response, or logs `x-request-id` for support tickets, needs those headers present in test fixtures — a bare JSON body alone doesn't exercise that code path. This tool includes a realistic header set by default.
Success vs. Error Response Shapes
Most real APIs return a fundamentally different body structure for errors than for success — your example JSON only describes the success case, so selecting an error status code automatically switches to a generic error envelope rather than trying to force your success shape into an error response.
Practical Examples
Mocking a Successful List Response
Testing a UI component that renders a list of orders.
- 1.Paste an example order object
- 2.Status: 200, check 'Return a list'
- 3.Copy the full mock response for your test setup
Mocking a Rate-Limited Error
Testing error-handling UI.
- 1.Status: 429
- 2.Body automatically switches to an error envelope
What's Generated
- HTTP status line (code + reason phrase)
- content-type, x-request-id, and date headers
- Success body (from your example) or error envelope, based on status
Good Use Cases
- Configuring mock server handlers (MSW, json-server)
- Writing test fixtures that include headers, not just a body
- Testing error-handling UI against realistic error responses
- Prototyping frontend code before a real backend exists
Frequently Asked Questions
How is this different from a plain mock data generator?
This generates a complete HTTP response, not just a JSON body — a status line (e.g. "HTTP/1.1 200 OK"), realistic response headers (content-type, a fake x-request-id, a date header), and the body itself, matching the full shape you'd see from a real API call or mock server configuration.
What happens when I select a 4xx/5xx status code?
The body switches to a generic error envelope ({ error: { code, message } }) instead of your example's success shape, since error responses typically don't return the same body structure as success responses.
Why include a fake request ID and date header?
Real APIs almost always include these for request tracing and caching — including them in the mock output makes it a more realistic stand-in for testing code that reads response headers, not just the body.
Can I use this to configure a mock server (like MSW or json-server)?
Yes — the generated status, headers, and body can be copied directly into a mock handler definition for tools like Mock Service Worker, json-server, or a manually stubbed fetch response in tests.
Is my example JSON sent anywhere?
No, generation happens entirely in your browser.