Reread a response body from JavaScript's fetch

Question

fetch() returns promise which (if successful) resolves to a Response object. A very common thing to do is immediately call Response.json() to convert the response body to a JSON object.

If the response body isn't valid JSON, then the Response.json() promise fails with an error. The message is something along the lines of:

Unexpected token X in JSON at position 0

That's not very helpful when trying to diagnose the problem; ideally I'd like to be able to see the content from the server (which is often an error message).

However, it appears that you can only read the stream at Response.body once (at least in Chrome). (There's even a read-only Response.bodyUsed flag.) That has already happened when Response.json() tries to convert the body to JSON, so the body appears to be lost forever in the event of a JSON parsing failure.

Is there any way to recover the original response body... short of manually reading it (and then converting to JSON) when the original fetch Promise resolves?

Answer 1

Use Response.clone() to clone Response

let clone = response.clone(); 

Alternatively, use Response.body.getReader() which returns a ReadableStream to read Response as a stream, TextDecoder() to convert Uint8Array data stream to text.