`Fetch` no longer returns all rows of the same-name response headers after RN Upgrade

[Rah1x]

• I have reviewed the documentation
• I have searched existing issues
• I am using the latest React Native version

Fetch is no longer returning all rows of the same-name response headers! This only just happened after recent upgrade.

Environment

Environment:
OS: Windows 10
Node: 9.2.0
Yarn: 1.3.2
npm: 5.8.0
Watchman: Not Found
Xcode: N/A
Android Studio: Version 3.0.0.0 AI-171.4443003

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: ^0.55.3 => 0.55.3

Steps to Reproduce

Server returns the following response

return response()->json(['msg'=>'1'], 200)
->withHeaders(['Content-Type'=>'application/json', 't1'=>[1, 2]]);

** react native code **

let response = await fetch('http://im-sick-and-tired-of-hunting-react-native-bugs',
{
            credentials: 'include',
            method: 'GET',
            cache: 'no-cache',
            mode: 'cors',
            headers: {'Cache-Control': 'no-cache', 'Accept':'*/*', 'Content-Type':'application/json'},
});
console.log(response.headers.get('t1')); 

Expected Behavior

The test hdr (t1) must have both values but only the 2nd one is received. See the response from postman

Actual Behavior

[Rah1x]

This btw JUST STARTED!! so dont tell me the code / server etc is wrong.. cause it was working for long while

[ajaykumar97]

Also have same issue after upgrading RN version 0.53 to 0.55. fetch() is not returning body returned by the server. When I downgraded to RN version 0.53, it works well. Please give the solution.

[Rah1x]

So ive upgraded to latest commit and still same issue:

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: ^0.55.3 => 0.55.3

[ajaykumar97]

I have just resolved this problem by converting fetch() response into json using response.json() method, which in-turns, returns a promise which returns the actual response from server using .then().

fetch('https://facebook.github.io/react-native/movies.json')
.then((response) => response.json()) <----converting response into json
.then((responseJson) => { <----handeling promise
return responseJson.movies;
})
.catch((error) => {
console.error(error);
});

reference: https://facebook.github.io/react-native/docs/network.html

[Rah1x]

@ajaykumar97 your problem was with the body and not with the header. So actually you didnt have a problem on this thread, as the body is always there and retrieved using response.json()

[ciaranw]

I've also just ran into this problem. It seems to be an issue with the WritableMap that collects the response headers in the translateHeaders() method in com.facebook.react.modules.network.NetworkingModule. The code checks to see if the key exists in the map, but for some reason it returns false. Debugging the code, it calls hasKey() on ReadableNativeMap. This drops down to the local map since mUseNativeAccessor is false, and the local map is empty.

[Rah1x]

Awesome man @ciaranw thanks for the investigation. I hope someone picks it up and solves it.. As a temporary solution I had to push the CSRF tokens from the api framework into the body instead..

[ciaranw]

I suspect the issue was introduced in commit 7891805 but i'm not an expert on android or C++ so I can't be sure!

[jmheik]

Our app was also affected by this when trying to update to 0.55.4. It breaks use case of reading cookies from responses as there's often more than one set-cookie headers in one response.

[Rah1x]

@jmheik
Its true, thats exactly what happened to me too. its common to have many set-cookie in a header, but not anymore. You have to now find a way to manually pas and receive the cookie in the body like I did.

[kelvinlawson]

I'm seeing the same thing happening since upgrading from RN 0.52 to 0.54.

Headers being returned by some servers we use have the same fields spread across multiple lines. Since 0.54 it is not possible to talk to these devices any more using RN on Android! RN on iOS is fine.

[ChrisBlood]

Same issue affect our app when moving from RN 0.52 The server we are connecting to returns Basic & Digest authentication headers but in the Android app we only get the Basic authentication header returned. The same servers work OK on iOS

[patricksmith]

We were affected by this issue after upgrading our Android app from RN 0.53.3 to RN 0.54.4, and I see that it's still an issue in RN 0.55.4. We're using an API that returns multiple Link headers and we're now only receiving one of those headers in our app.