# FlutterFlow

FlutterFlow wird zu einer App kompiliert, die dein Nutzer in der Hand hält, daher geht es nicht darum, welche Felder ausgefüllt werden müssen, sondern wo der Schlüssel landet. Die untenstehende Anfrage wurde exakt so an die Produktion gesendet, wie sie vom Aufruf zusammengesetzt wird; die Schritte in FlutterFlow basieren auf der FlutterFlow‑Dokumentation vom 2026‑09‑17.

Erstelle zuerst einen Schlüssel, wie im Abschnitt [Schlüssel für die Automatisierung](/integrations/#ключ-для-автоматизації) beschrieben, mit dem Bereich `chart`.

<Aside type="caution" title="Ключ у звичайному виклику їде разом із застосунком">
Ein Aufruf, der nicht als privat markiert ist, wird vom Gerät aus ausgeführt, und sein Header liegt innerhalb des kompilierten Builds für iOS, Android und Web, wo ihn jeder lesen kann. Mach den Aufruf **privat**: Dann leitet FlutterFlow ihn über eine Firebase Cloud Function weiter, und der Schlüssel bleibt auf dem Server. Eine eigene Prüfung von FlutterFlow besteht darin, den Projektcode herunterzuladen und nach dem Schlüssel in den Frontend‑Dateien zu suchen, was nur im kostenpflichtigen Tarif verfügbar ist.
</Aside>

## 1. Erstelle den Aufruf

Öffne **API Calls**, klicke **+ Add**, wähle **Create API Call** und fülle aus:

- **API Call Name**: `Natal chart`.
- **Method Type**: `POST`.
- **URL**:

  ```
  https://api.astroway.info/v1/chart
  ```

- Reiter **Headers**, **+ Add Header**: eine Zeile `X-Api-Key: ` gefolgt von deinem Schlüssel. Eine zweite Zeile `Content-Type: application/json`.
- Reiter **Variables**: fünf Variablen vom Typ String, `date`, `time`, `timezone`, `latitude`, `longitude`, jede mit einem Standardwert aus dem JSON unten.
- Reiter **Body**, im Dropdown **JSON**: füge das JSON ein und ziehe die Variablen hinein.

```json
{
  "date": "1990-05-15",
  "time": "14:30:00",
  "timezone": "Europe/Kyiv",
  "latitude": "50.45",
  "longitude": "30.52"
}
```

Breite und Länge bleiben bewusst Strings: Die API akzeptiert `"50.45"` als Zahl, und ein String erleichtert das Ziehen der Variablen.

Klicke **Add Call**, öffne **Response & Test**, klicke **Test API Call** und sieh dir die Antwort in **Test Response** an. `data.input.timezoneOffset` wird als `4` zurückgegeben: genau dieser Offset hielt Kiew zu diesem Datum.

## 2. Mache den Aufruf privat

Aktiviere im **Advanced Settings** des Aufrufs **Make Private**, klicke **Save**, dann **Deploy APIs**. Jetzt wird der Aufruf in einer Firebase Cloud Function ausgeführt, sodass das Projekt ein angeschlossenes Firebase und einen Firebase‑Tarif mit Cloud Functions benötigt.

<Aside type="caution" title="Приватні виклики не успадковують заголовки групи">
Wenn du den Schlüssel auf die **API Group** legst und nicht auf den Aufruf selbst, hört FlutterFlow auf, ihn sofort zu senden, sobald der Aufruf privat wird: Gruppen‑Header werden bei privaten Aufrufen nicht vererbt. Füge `X-Api-Key` zum Aufruf selbst hinzu, sonst gibt der erste private Lauf `401` zurück.
</Aside>

Noch zwei Dinge, die die FlutterFlow‑Dokumentation klar sagt: Ein Schlüssel, der vom Frontend übermittelt wird, zum Beispiel via Remote Config, bleibt selbst bei einem privaten Aufruf offen, und die sichere Form ist ein Header, der direkt im Aufruf eingebettet ist.

## 3. Lese die Antwort

Im **JSON Paths** klicke **+ Add JSON Path** und gib jedem einen Namen:

| Name | JSON Path |
|---|---|
| `ascendant` | `$.data.houses.ascendant` |
| `sunLongitude` | `$.data.planets[0].longitude` |
| `moonLongitude` | `$.data.planets[1].longitude` |
| `offsetUsed` | `$.data.input.timezoneOffset` |

Das Zeichen ist die Länge, geteilt durch 30 und abgerundet, als Index in einer Liste von zwölf Namen: Zum Beispiel ergibt der Aszendent `159.26` den Wert `5`, also Jungfrau. Eine benutzerdefinierte Funktion von vier Zeilen oder eine Liste mit zwölf Einträgen und dem Index reicht aus.

## Web-Build kann nicht aus dem Browser zu uns greifen

Gemessen am 2026‑09‑17 von einer Seite auf einer fremden Domain: `POST /v1/chart` antwortet auf den Preflight ohne Header `access-control-allow-origin`, und Chrome blockiert die Anfrage. Für den Browser auf einer fremden Domain antworten nur `/v1/public/*` und `/v1/embed/*`.

FlutterFlow leitet Aufrufe über einen eigenen Proxy im Builder, im Run‑Modus und Test‑Modus, sodass ein Aufruf, der dort funktioniert, nach der Veröffentlichung der Web‑App fehlschlagen kann. Zwei Lösungen, und die erste empfehlen wir:

- **Mache den Aufruf privat**, wie oben. Dann wird er in einer Cloud Function ausgeführt und nicht im Browser, was sofort sowohl das Schlüssel‑ als auch das CORS‑Problem löst.
- **Stelle uns ein eigenes Backend zur Verfügung**, falls du bereits eines hast. Die Proxy‑Einstellungen in FlutterFlow, zusammen mit einer eigenen proxy URL, sind für den Builder und die Run‑ und Test‑Modi dokumentiert; die Dokumentation sagt nichts über die veröffentlichte Web‑Build, daher sollte man dort nicht darauf zählen.

Ein öffentlicher Schlüssel `pk_` löst das nicht: Er greift nur auf `/v1/public/*` und `/v1/embed/*` zu, und wird von Builds für iOS und Android komplett abgelehnt, weil sie keinen Web‑Origin senden.

## Fehler

- **`401`** bei privatem Aufruf: Der Schlüssel liegt auf der Gruppe, nicht auf dem Aufruf.
- **`400 INVALID_FIELD` mit `timezone` in `details`**: Die Zone ist leer, es ist eine Abkürzung wie `EST` oder kein Zonenname.
- **`400` mit `date` oder `time` in `details`**: Das Format ist nicht `YYYY-MM-DD` / `HH:MM:SS`.
- **`403 ENDPOINT_NOT_IN_SCOPE`**: Der Bereich des Schlüssels enthält kein `chart`.
- **`429 KEY_BUDGET_EXHAUSTED`**: Der Schlüssel hat sein Budget erschöpft; erhöhe es im Dashboard.

<Aside type="note">
Der kostenlose Tarif von FlutterFlow erlaubt zwei API‑Endpunkte pro Projekt und hat keinen OpenAPI‑Import, sodass der Aufruf manuell hinzugefügt wird und noch ein Slot übrig bleibt. Die API führt keine Geokodierung durch: Koordinaten werden aus deinen eigenen Felder oder aus einem Geokodierungs‑Service genommen, für den du einen Schlüssel hast.
</Aside>