Why does my API return HTML instead of JSON, causing a parse error?

This usually happens when the request hits something other than your API endpoint. Common causes: the URL is wrong and the server returns its default 404 HTML page; a reverse proxy like Nginx returns its own 502/503 error page when the backend is down; the server redirects the request to a login page (302 redirect to HTML); or the API application crashed and the web server returned a fallback HTML error. Check the Network tab Response for the actual HTML content to identify which system generated it.

What does 'Unexpected end of JSON input' mean?

This SyntaxError occurs when JSON.parse() receives an empty string or a truncated JSON body. Common causes: the server returned a 204 No Content with no body; the server returned a 200 with an empty body; the server crashed mid-response and the body was truncated; or a network interruption cut the response short. Check if the response body is empty before parsing, and handle 204 responses by returning null instead of attempting to parse.

Can I call both response.json() and response.text() on the same fetch response?

No. The response body is a ReadableStream that can only be consumed once. After calling response.json() or response.text(), the stream is exhausted and calling either method again throws an error. To handle both scenarios, call response.text() first to get the raw string, then use JSON.parse() manually in a try/catch block. This lets you access the raw text for error logging if JSON parsing fails.

What is a BOM character and how does it cause JSON parse errors?

A BOM (Byte Order Mark) is an invisible Unicode character (U+FEFF) that some systems prepend to UTF-8 files to indicate encoding. When present at the start of a JSON response, it appears before the opening { or [ and causes JSON.parse() to fail with 'Unexpected token' at position 0. The error message may show a blank character. Fix it by stripping the BOM before parsing: if (text.charCodeAt(0) === 0xFEFF) text = text.slice(1). On the server side, ensure JSON serialization does not include a BOM.

How should I configure my server to always return JSON for API errors?

Add a custom error handler middleware that checks if the request path starts with /api/ and returns JSON instead of HTML. In Express: app.use((err, req, res, next) => { if (req.path.startsWith('/api/')) { return res.status(err.status || 500).json({ error: err.message }); } }). In Nginx, use proxy_intercept_errors and a custom error_page that returns a JSON body with default_type application/json. This prevents the client from ever receiving HTML when it expects JSON.

JSON Parse Errors from API Responses