React-native: Fetch return blob instead of text after 0.59 RN update

[kunalqss]

🐛 Bug Report

I updated my RN app from 0.51 version to 0.59 and instead of bodyText, server returns _bodyBlob_ now.

I tried to use response.json() function to see if it works, but it doesn't help.

fetch(`myUrl`, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'Accept-Language': 'ru,en;q=0.9',
      },
       body: '{"login":"root","password":"root"}'
    })
      .then((response) => {
        console.log(response.json());
      });

The server response I get is like this:

{
    "type": "default",
    "status": 200,
    "ok": true,
    "headers": {
        "map": {
            "x-xss-protection": "1",
            "set-cookie": "jwt=eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyLWNvZGUiOiJyb290LXVzZXIiLCJleHAiOjE1NTU0MjY0Mjl9.UaHzsIil8t9HtgrBF8JN0c2W-eIIkDEmb6GvO9Do0-A;Expires=Tue, 16 Apr 2019 14:53:49 +0000;Path=/;HttpOnly;SameSite=Strict",
            "connection": "keep-alive",
            "content-length": "360",
            "content-type": "application/json;charset=utf-8",
            "date": "Tue, 16 Apr 2019 13:53:49 GMT",
            "server": "nginx/1.15.10"
        }
    },
    "url": "***",
    "_bodyInit": {
        "_data": {
            "size": 360,
            "offset": 0,
            "blobId": "3397402a-12dd-4dd9-8980-90924aeb416d"
        }
    },
    "_bodyBlob": {
        "_data": {
            "size": 360,
            "offset": 0,
            "blobId": "3397402a-12dd-4dd9-8980-90924aeb416d"
        }
    }
}

instead of normal bodyText i get bodyBlob

To Reproduce

Run React Native Example Project as use fetch as provided on official documentation page.
https://facebook.github.io/react-native/docs/network.
Fetch will return a blob http response as shown below -

{ type: 'default', status: 200, ok: true, statusText: undefined, headers: { map: { vary: 'Accept-Encoding', age: '65', via: '1.1 varnish', 'accept-ranges': 'bytes', expires: 'Fri, 19 Apr 2019 04:10:24 GMT', etag: 'W/"5cb9036c-1ca"', server: 'GitHub.com', 'content-type': 'application/json; charset=utf-8', 'x-fastly-request-id': 'bba84002d2e71ff1451fe1d187d3374cf7e40ffa', 'x-timer': 'S1555651178.510929,VS0,VE1', 'x-cache-hits': '1', 'x-cache': 'HIT', 'x-served-by': 'cache-sin18029-SIN', date: 'Fri, 19 Apr 2019 05:19:37 GMT', 'x-github-request-id': '1A3C:68D6:525266:589E1F:5CB947D7', 'cache-control': 'max-age=600', 'access-control-allow-origin': '*', 'last-modified': 'Thu, 18 Apr 2019 23:08:28 GMT' } }, url: 'https://facebook.github.io/react-native/movies.json', _bodyInit: { _data: { size: 458, offset: 0, blobId: '6d8c3779-2a4e-4ac0-94dd-8de68c4f3281' } }, _bodyBlob: { _data: { size: 458, offset: 0, blobId: '6d8c3779-2a4e-4ac0-94dd-8de68c4f3281' } } }

Expected Behavior

Instead of bodyBlob we should be getting properly formatted JSON content.

Code Example

Environment

React Native Environment Info:
System:
OS: Windows 10
CPU: (8) x64 Intel(R) Core(TM) i7-7700 CPU @ 3.60GHz
Memory: 17.55 GB / 31.89 GB
Binaries:
npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
IDEs:
Android Studio: Version 3.3.0.0 AI-182.5107.16.33.5314842

[JKCooper2]

Unable to repro: https://snack.expo.io/@jkcooper/rn24520---fetch-blob-response
Can you test your details in the snack (or create a new snack to test)

.json does return a promise afaik so you may need to let that resolve before logging:

fetch(`myUrl`, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'Accept-Language': 'ru,en;q=0.9',
      },
       body: '{"login":"root","password":"root"}'
    })
      .then(response =>response.json()) // returns promise
      .then(responseJson => console.log(responseJson));

[kunalqss]

Thanks ! This resolved all issues for me.
Now instead of getting _bodyInit_ like I did before, I am getting properly formatted JSON Response.

[bijoycse]

Thanks, it's working

[bockc]

In version 0.60.4 this is back. See this issue

[anagar23]

@JKCooper2 , if I call .json() first, then, I am not able to check whether it's error or not. From my backend side they only sent message in the response.

How can I check the error case If I don't want to bother backend?

[skurgansky-sugarcrm]

guys do you have react-native-google-signin dependency in your project ?
I noticed that when i am signing in with google fetch is broken, but when i do sign in with office it works fine.