b847b5d2c8
- Verzeichnisstruktur unter /docs spiegelt nun die tatsächliche Projektstruktur wider - frontend/server-Trennung entfernt zugunsten von /docs/pages, /docs/redux, /docs/utils etc. - Erhöht Wiederauffindbarkeit, Übersichtlichkeit und Entwicklerfreundlichkeit
45 lines
1.2 KiB
Markdown
45 lines
1.2 KiB
Markdown
# 📍 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`
|