# 📍 useFetchPoiData – Laden von POI-Typen und Icons ## Zweck Dieser React-Hook wird im Frontend verwendet, um: 1. Alle POI-Typen (`poiTyp/readPoiTyp`) 2. Alle POI-Icons (`pois/poi-icons`) vom Server abzurufen und sie in lokale React-Komponenten zu laden. --- ## Aufrufstruktur ```js const API_BASE_URL = typeof window !== "undefined" ? `${window.location.protocol}//${window.location.hostname}:3000` : ""; await fetch(`${API_BASE_URL}/api/talas_v5_DB/poiTyp/readPoiTyp`); await fetch(`${API_BASE_URL}/api/talas_v5_DB/pois/poi-icons`); ``` --- ## Erklärung Da die Anwendung produktiv über Port `80` läuft, aber die Next.js-API auf Port `3000`, wird `:3000` explizit in der URL ergänzt. Dieser Hook funktioniert nur im Client-Browser. Die Prüfung mit `typeof window !== "undefined"` schützt davor, dass `window` im SSR-Kontext (Server-Side Rendering) undefined ist. --- ## Verhalten bei Fehlern - Wenn die Antwort nicht `ok` ist (z. B. 404, 500), wird ein Fehler in der Console angezeigt. - Wenn die Daten kein Array sind (für `poiTyp`), wird eine zusätzliche Validierung ausgelöst. --- ## Siehe auch - [`MapComponent`](../components/MapComponent.md) - `pages/api/talas_v5_DB/poiTyp/readPoiTyp.js` - `pages/api/talas_v5_DB/pois/poi-icons.js`