I have a web application that exposes a Rest API endpoint in a domain, then I have a React Native application that consumes that endpoint fetching it. While the Expo Go application does work (even where the API is an external domain and not localhost), the Android Studio device simulator does not show any data.
I am new to React Native, so maybe there is something that I am missing, but I can't even debug the application, using console.log does not display anything in the LogCat (but this is another problem for another day).
This is how my API endpoint looks like:
export async function GET(req: NextRequest) { // some other code return NextResponse.json({ data }, { headers: {'Access-Control-Allow-Origin': '*', } })}And this is the React Native code:
interface Data { id: number name: string}export default function SearchScreen() { const [searchQuery, setSearchQuery] = useState("") const [results, setResults] = useState<Data[]>([]) const handleSearch = async () => { const apiUrl = `${process.env?.EXPO_PUBLIC_BASE_URL}/api/search` try { const response = await fetch(`${apiUrl}?k=${searchQuery.toLowerCase()}`) const data = await response.json() setResults(data) } catch (err) { // set the error } } return (<View> {/* display the data */}</View> )}The EXPO_PUBLIC_BASE_URL has the external domain at https://mydomain.ext.
As a reminder, this works okay in the Expo Go application after scanning the QR code, but it doesn't in the emulated application within Android Studio Device Manager. What am I doing wrong? How do I fix it?






