Android 未处理的承诺拒绝:TypeError:网络请求失败expo节点后端
我的expo应用程序正在查询一个节点后端。node express mongo后端工作非常完美,我可以使用来自Postman的GET请求进行验证,但我的应用程序中出现未处理的承诺拒绝网络失败错误 完全错误:Android 未处理的承诺拒绝:TypeError:网络请求失败expo节点后端,android,react-native,fetch,expo,Android,React Native,Fetch,Expo,我的expo应用程序正在查询一个节点后端。node express mongo后端工作非常完美,我可以使用来自Postman的GET请求进行验证,但我的应用程序中出现未处理的承诺拒绝网络失败错误 完全错误: [Unhandled promise rejection: TypeError: Network request failed] - node_modules/whatwg-fetch/dist/fetch.umd.js:473:29 in xhr.onerror - node_module
[Unhandled promise rejection: TypeError: Network request failed]
- node_modules/whatwg-fetch/dist/fetch.umd.js:473:29 in xhr.onerror
- node_modules/event-target-shim/dist/event-target-shim.js:818:39 in EventTarget.prototype.dispatchEvent
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:574:29 in setReadyState
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:388:25 in __didCompleteResponse
- node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:190:12 in emit
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:436:47 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:26 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:384:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:110:17 in __guard$argument_0
* [native code]:null in callFunctionReturnFlushedQueue
这是我的密码:
api.js
export const fetchMeetups = () =>
fetch('http://localhost:3000/api/meetups')
.then(res => res.json());
import * as React from 'react';
import { Platform, StyleSheet, Text, View, ActivityIndicator } from 'react-native';
import { fetchMeetups } from './constants/api';
const instructions = Platform.select({
ios: `Press Cmd+R to reload,\nCmd+D or shake for dev menu`,
android: `Double tap R on your keyboard to reload,\nShake or press menu button for dev menu`,
});
class App extends React.Component{
static defaultProps = {
fetchMeetups
}
state = {
loading: false,
meetups: []
}
async componentDidMount(){
this.setState({loading: true});
const data = await this.props.fetchMeetups();
setTimeout(() => this.setState({loading: false, meetups: data.meetups}),2000)
}
render(){
if(this.state.loading){
return(
<ActivityIndicator size="large"/>
)
}
return (
<View style={styles.container}>
<Text>MeetupME</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
import { registerRootComponent } from 'expo';
import App from './App';
// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in the Expo client or in a native build,
// the environment is set up appropriately
registerRootComponent(App);
App.js
export const fetchMeetups = () =>
fetch('http://localhost:3000/api/meetups')
.then(res => res.json());
import * as React from 'react';
import { Platform, StyleSheet, Text, View, ActivityIndicator } from 'react-native';
import { fetchMeetups } from './constants/api';
const instructions = Platform.select({
ios: `Press Cmd+R to reload,\nCmd+D or shake for dev menu`,
android: `Double tap R on your keyboard to reload,\nShake or press menu button for dev menu`,
});
class App extends React.Component{
static defaultProps = {
fetchMeetups
}
state = {
loading: false,
meetups: []
}
async componentDidMount(){
this.setState({loading: true});
const data = await this.props.fetchMeetups();
setTimeout(() => this.setState({loading: false, meetups: data.meetups}),2000)
}
render(){
if(this.state.loading){
return(
<ActivityIndicator size="large"/>
)
}
return (
<View style={styles.container}>
<Text>MeetupME</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
import { registerRootComponent } from 'expo';
import App from './App';
// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in the Expo client or in a native build,
// the environment is set up appropriately
registerRootComponent(App);
--------------更新------------------
添加了一个catch块来获取和获取此新错误
Network request failed
- node_modules/whatwg-fetch/dist/fetch.umd.js:473:29 in xhr.onerror
- node_modules/event-target-shim/dist/event-target-shim.js:818:39 in EventTarget.prototype.dispatchEvent
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:574:29 in setReadyState
- node_modules/react-native/Libraries/Network/XMLHttpRequest.js:388:25 in __didCompleteResponse
- node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:190:12 in emit
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:436:47 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:26 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:384:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:110:17 in __guard$argument_0
* [native code]:null in callFunctionReturnFlushedQueue
代替url中的localhost,提供您的ip地址,就像在React native Expo和Python Django后端上有同样的问题一样。 问题是关于仿真器localhost和服务器localhost之间的冲突。 您的后端服务器可能正在127.0.0.1:8000上运行,但模拟器找不到 在终端中,使用命令“ipconfig”查找Ipv4地址。 例如,它将是192.138.1.40 在这之后,把它放进你的取物箱( ''。
还有一点很重要-使用相同的主机和端口运行后端服务器。
例如,在python Django上: py manage.py运行服务器192.138.1.40:8000
在Django上,您还需要在settings.py中添加不起作用的允许的_HOSTS=['192.138.1.40']。localhost:3000/api/meetups是节点进程,现在也在浏览器中…这个地址没有返回json…我仍然在expo emulator apprun中得到未解决的promise错误,这在终端中-adb反向tcp:8163 tcp:8163和tryno没有帮助…我认为fetch有一些问题…因为它没有从fetch获取json对象…它应该获取json对象来自localhost:3000/api/meetups…就像在邮差的情况下,当我发出localhost:3000/api/meetups获取请求时…它在浏览器中也会返回json…所以我认为它在后端部分工作…同时反应部分也正确…唯一不工作的部分。。。。const data=wait this.props.fetchMeetups();