Programação B

Conectando na API

No navegador, fetch("/api/events") funciona porque a página está na mesma origem que o backend. No mobile, a situação é diferente. O aplicativo não roda num navegador — não existe “mesma origem”. A URL precisa ser absoluta.

E tem um detalhe: http://localhost:3000 não funciona no emulador Android. O localhost do emulador é o próprio emulador, não a sua máquina. O Android oferece o endereço especial 10.0.2.2 para acessar o localhost do host. No iOS Simulator, localhost funciona porque o simulador compartilha a rede com o macOS. E num celular físico, você precisa do IP da sua máquina na rede local.

Para não ficar alterando a URL manualmente, crie um arquivo de configuração. Crie src/config.ts:

import { Platform } from "react-native";

function getBaseUrl(): string {
  if (Platform.OS === "android") {
    return "http://10.0.2.2:3000";
  }
  return "http://localhost:3000";
}

export const API_BASE_URL = getBaseUrl();

O Platform.OS retorna "android" ou "ios" dependendo de onde o app está rodando. Se estiver testando num celular físico, substitua o retorno pelo IP da sua máquina (ex: "http://192.168.1.42:3000").

Uma vantagem: como o React Native não roda no navegador, não existe CORS. A política de mesma origem é uma restrição do browser — aplicativos nativos fazem requisições HTTP para qualquer URL sem restrições.