I built WEB Api with ASP.NET MVC. I can access the API with fetch from JavaScript in my browser. But when I try to access the API from React Native App, I get a warning: "Possible Unhandled Promise Rejection (id: 2):......."
I do understand the warning since nothing is showing up on the screen, but I do wonder how would anyone call Web api on localhost from react native app.
I am running my react native app with "expo start --localhost --android" and it is showing up on my android phone connected with USB to my mashine.
App.Js
import React from "react";import { StyleSheet, Text, View, FlatList } from "react-native";import Constants from "expo-constants";import Row from "./Row";export default class App extends React.Component { state = { movies: null, isLoading: true }; componentDidMount() { return fetch("https://localhost:44343/api/movies") .then(response => { return response.json(); }) .then(data => { this.setState({ movies: data, isLoading: false }); }) .catch(err => { this.setState({ movies: [...this.state.movies, err] }); }); } render() { if (this.state.isLoading) { return (<View style={styles.container}><Text>Loading...</Text></View> ); } else { return (<View style={styles.container}><Text style={styles.text}>-MOVIES-</Text><FlatList data={this.state.movies} renderItem={({ item }) => <Row movies={item} />} /></View> ); } }}const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", alignItems: "center", justifyContent: "center", paddingTop: Constants.statusBarHeight }, text: { fontSize: 40 }});
if you look at componentDidMount()
i tried to call fetch("https://localhost:44343/api/movies")
, but it is not working, but when i run my app on Web, it is working just fine.
Does anyone have a clue how to fix this, so I can call api directly from react native?