Multiple fetch request starts to not resolve or reject promise #21862
Description
- Review the documentation: https://facebook.github.io/react-native
- Search for existing issues: https://github.com/facebook/react-native/issues
- Use the latest React Native release: https://github.com/facebook/react-native/releases
Environment
React Native Environment Info:
System:
OS: macOS 10.14
CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 1.60 GB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.9.0 - ~/.nvm/versions/node/v10.9.0/bin/node
Yarn: 1.10.1 - /usr/local/bin/yarn
npm: 6.2.0 - ~/.nvm/versions/node/v10.9.0/bin/npm
Watchman: 4.7.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.0, macOS 10.14, tvOS 12.0, watchOS 5.0
Android SDK:
Build Tools: 23.0.1, 23.0.2, 23.0.3, 24.0.0, 24.0.1, 25.0.1, 26.0.0, 26.0.1, 26.0.2, 26.0.3, 27.0.3
API Levels: 23, 25, 26
IDEs:
Android Studio: 3.1 AI-173.4907809
Xcode: 10.0/10A255 - /usr/bin/xcodebuild
npmPackages:
react: 16.6.0-alpha.8af6728 => 16.6.0-alpha.8af6728
react-native: 0.57.3 => 0.57.3
npmGlobalPackages:
create-react-native-app: 2.0.2
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
svg-to-react-native-cli: 0.0.3
Description
When doing multiple fetch request one after another, not all request promises are resolved or rejected, some get lost.
I ran same code on older react native version 0.50.4 and it was working there. So its an issue in new react native.
Quite major and critical issue.
Reproducible Demo
import React, { Component } from 'react';
import { NetInfo, TouchableOpacity, Text, View } from 'react-native';
export class AppContainer extends Component {
componentDidMount() {
NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectionChange);
}
componentWillUnmount() {
NetInfo.isConnected.removeEventListener('connectionChange', this.handleConnectionChange);
}
handleConnectionChange() {
}
onPress() {
const fullUrl = 'https://google.com';
for (let i = 0; i < 10; i++) {
console.log(i);
NetInfo.isConnected.fetch().then(isConnected => {
console.log('NetInfo.isConnected.fetch-success', isConnected);
fetch(fullUrl)
.then(response => {
console.log('fetch-success', response);
})
.catch(error => console.log('fetch-error', error));
}).catch(error => console.log('NetInfo.isConnected.fetch-error', error));
}
}
render() {
return (
<View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
<TouchableOpacity onPress={this.onPress} style={{backgroundColor: 'red'}}>
<Text>{'Click Me'}</Text>
</TouchableOpacity>
</View>
);
}
}
Activity
react-native-bot commentedon Oct 19, 2018
Can you run
react-native infoand edit your issue to include these results under the Environment section?If you believe this information is irrelevant to the reported issue, you may write
[skip envinfo]under Environment to let us know.rvaitkus23 commentedon Oct 22, 2018
+1
rvaitkus23 commentedon Oct 22, 2018
It looks like this issues was introduces in version 0.57. I have tried to reproduce it in clean project with version 0.56.1. All requests are resolved.
Can anyone please review commits to Network library and find out that could be the cause?
donatasvyzasdb commentedon Oct 22, 2018
+1
This seems like a serious bug. If you call fetch() 10 times in a row, but only 5-7 of those request Promises are resolved or rejected and the rest are just eaten without any trace, this is severe.
Anyone else experiencing the same issue?
tomauty commentedon Oct 29, 2018
Yes, experiencing it now. It usually hangs at the same place for me, and very occasionally resolves. We fire off at least 10 fetch calls at app launch.
Edit: Seems to be an issue with
NetInfo. When I remove my waiting for connection call they all resolve no problem.Edit 2: This appears to be the commit in question:
67afaef#diff-82c5d95c19a17c3f2375f0b1e09f6da4
tsvetan-ganev commentedon Dec 7, 2018
I just wasted my day trying to figure out why my parallel HTTP requests were failing on iOS but working fine on Android.
I have a thin wrapper around the
fetchfunction in order to detect network errors and handle HTTP status codes correctly.When I'm making multiple HTTP calls at once (with
Promise.all) only the first request gets sent to the server and the others get stuck - neither resolved, nor rejected. However, on non-parallel calls (e.g. for..of loop which awaits every response) it worked fine. This made it almost impossible to find the reason for my requests being sucked into a black hole. Needless to say this is a pretty serious issue for all mobile apps interacting with a REST API.soumyamishra89 commentedon Jan 25, 2019
Any update on this issue? I am also facing the same issue where the request is not resolved and nothing is sent to the server on IOS. works fine on Android.
I am using react-native: 0.57.8
juanfer0002 commentedon Jan 25, 2019
@soumyamishra89It works fine in 0.56, you may want to downgrade in this one.
soumyamishra89 commentedon Jan 25, 2019
@juanfer0002 : any plans to fix this in the next release?
juanfer0002 commentedon Jan 26, 2019
I don't know, i just found out that worked in that versio. I'm not contributor. I'm also waiting for a solution to this
soumyamishra89 commentedon Feb 4, 2019
I have tested it with the latest rn 0.58.3 version and the issue still exist. I have reverted to 0.56. Is anyone looking into this?
tb9-Mason commentedon Feb 7, 2019
I am also experiencing this issue using the expo SDK 32.0.0. We are using frisbee, but calls fail on our iOS standalone builds. We don't see the same issue in our Android standalone builds.
cpojer commentedon Feb 12, 2019
Heads up: we moved react-native-netinfo into its own repository, which should allow for making changes and fixes much faster. Please continue the discussion about this issue there: react-native-netinfo/react-native-netinfo#10