Android: fetch throws Java exception on malformed JSON response

[overminder]

Context

• Reproducible on react-native@{0.29.0,0.30.0,0.31.0-rc.1,0.34.1,0.35.0-rc.0}
• Android 4.4, 5.0, 5.1 and 6.0 (shouldn't matter)

Stack Trace

E/unknown:React: Exception in native call from JS
  com.facebook.react.devsupport.JSException: Failed to create String from JSON
    at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
    ...
  Caused by: com.facebook.jni.CppException: Failed to create String from JSON

Reproduction

1. Create a fresh react-native project by react-native init SomeProject.
2. Edit SomeProject/index.android.js by adding a fetch(kUri).then(x => x.json()); statement in SomeProject component class's componentDidMount method, where kUri points to a file served by a HTTP server. The content of the file is:

$ hexdump some-binary
0000000 ed b7 a1 0a
0000004

or in base64:

$ base64 some-binary
7behCg==

The HTTP response header for the URI is:

HTTP/1.1 200 OK
Content-Type: text/plain
Connection: close

Then run react-native run-android and observe a red screen that says Failed to create String from JSON (this is on 0.31.0-rc.1, the exact error message might differ in different react-native versions).

What's Expected

Parsing malformed JSON response bodies should just raise JS exceptions but not native exceptions - we have no way to catch the latter from JS.

Analysis

A quick search suggests that this error can only be thrown from Value::fromJSON:

:~/react-native/ReactAndroid (0.31-stable)
$ ag 'Failed to create'
src/main/jni/react/Value.cpp
41:    throwJSExecutionException("Failed to create String from JSON");

What it does is just calling JSValueMakeFromJSONString which can return NULL on invalid inputs (Apple's doc).

See Also

#9117

[overminder]

The throwing site seems to have been moved to here.

Pinging @cjhopman @astreet

[astreet]

I think @philikon recently added support for fetching binary content? I agree this doesn't seem like the best way of handling this. We might want to do some Content-Type validation in the native networking modules.

[npomfret]

I can reproduce by calling fetch with {method: 'HEAD'} on an image url. My code doesn't call the json() function at any point, and the content-type header is correct (image/jpeg).

It looks like maybe fetch on Android is buggy and assumes the content being returned will be json?

I tried issuing a HEAD request instead but just get a network error.

Both GET and HEAD requests to image url work on iOS.

[astreet]

RN did not initially support binary data since all bridge traffic is JSON serialized, so fetching an image with fetch would not work. I believe @philikon was working on a fix to allow binary content to be sent to JS.

[astreet]

This is the commit in question: 08c375f

It doesn't look like his follow-up diff he references in the commit message has landed yet however.

[lacker]

This looks like it's working in the most recent RN release, I am getting a yellow-box "unhandled promise rejection" instead of a native failure. Closing the issue. Thanks for reporting this!

[cbjs]

same problem with react-native@0.47.2
why this issue is closed.