# FlutterFlow

FlutterFlow compileert tot een app die in de handen van je gebruiker ligt, dus de vraag is niet welke velden je moet invullen, maar waar de sleutel terechtkomt. Het verzoek hieronder is naar productie gestuurd precies in de vorm waarin het door de oproep wordt samengesteld; de stappen in FlutterFlow zijn geschreven volgens de FlutterFlow-documentatie van 2026-09-17.

Maak eerst een sleutel aan, zoals beschreven in de sectie [Sleutel voor automatisering](/integrations/#ключ-для-автоматизації), met het gebied `chart`.

<Aside type="caution" title="Sleutel in een gewone oproep gaat mee met de app">
Een oproep die niet als privé is gemarkeerd, wordt uitgevoerd vanaf het apparaat, en de header zit binnen de gecompileerde build voor iOS, Android en web, waar iedereen het kan lezen. Maak de oproep **privé**: dan voert FlutterFlow deze via een Firebase Cloud Function uit, en blijft de sleutel op de server. Een eigen controle van FlutterFlow is het projectcode downloaden en zoeken naar de sleutel in de frontend‑bestanden, en die is alleen beschikbaar op een betaald abonnement.
</Aside>

## 1. Maak een oproep

Open **API Calls**, klik op **+ Add**, selecteer **Create API Call** en vul in:

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

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

- Tab **Headers**, **+ Add Header**: één regel `X-Api-Key: ` gevolgd door je sleutel. Een tweede regel `Content-Type: application/json`.
- Tab **Variables**: vijf variabelen van het type String, `date`, `time`, `timezone`, `latitude`, `longitude`, elk met een standaardwaarde uit de JSON hieronder.
- Tab **Body**, in de dropdown **JSON**: plak de JSON en sleep er variabelen in.

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

Breedte- en lengtegraad blijven opzettelijk strings: de API accepteert `"50.45"` als getal, maar een string maakt het slepen van variabelen eenvoudiger.

Klik op **Add Call**, open **Response & Test**, klik op **Test API Call** en bekijk het antwoord in **Test Response**. `data.input.timezoneOffset` wordt geretourneerd als `4`: precies die tijdzone‑offset hield Kiev op die datum.

## 2. Maak de oproep privé

In **Advanced Settings** van de oproep schakel je **Make Private** in, klik op **Save**, daarna **Deploy APIs**. Nu wordt de oproep uitgevoerd in een Firebase Cloud Function, dus het project heeft een gekoppelde Firebase en een Firebase‑tarief met Cloud Functions nodig.

<Aside type="caution" title="Privé‑oproepen erven geen groeps‑headers">
Als je de sleutel op de **API Group** plaatst in plaats van op de oproep zelf, stopt FlutterFlow met het verzenden ervan op het moment dat de oproep privé wordt: groeps‑headers worden niet geërfd door privé‑oproepen. Voeg `X-Api-Key` toe aan de oproep zelf, anders geeft de eerste privé‑run een `401` terug.
</Aside>

Nog twee zaken die de FlutterFlow‑documentatie expliciet vermeldt: een sleutel die vanaf de frontend wordt doorgegeven, bijvoorbeeld via remote config, blijft open zelfs bij een privé‑oproep, en de veilige vorm is een header die in de oproep zelf is opgenomen.

## 3. Lees het antwoord

In **JSON Paths** klik op **+ Add JSON Path** en geef elk een naam:

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

Het teken is de lengtegraad gedeeld door 30 en naar beneden afgerond, als index in een lijst van twaalf namen: bijvoorbeeld Ascendant `159.26` geeft `5`, oftewel Maagd. Een aangepaste functie van vier regels of een lijst van twaalf regels en een index is voldoende.

## Web‑build kan niet vanuit de browser naar ons verwijzen

Gemeten op 2026-09-17 vanaf een pagina op een extern domein: `POST /v1/chart` beantwoordt de preflight zonder de header `access-control-allow-origin`, en Chrome blokkeert het verzoek. Alleen `/v1/public/*` en `/v1/embed/*` reageren op een browser op een ander domein.

FlutterFlow voert oproepen uit via een eigen proxy in de builder, in Run‑mode en Test‑mode, dus een oproep die daar werkt kan falen na publicatie van de web‑app. Twee oplossingen, en de eerste raden we aan:

- **Maak de oproep privé**, zoals hierboven. Dan wordt deze uitgevoerd in een Cloud Function, niet in de browser, en dit lost meteen zowel het sleutel‑ als het CORS‑probleem op.
- **Stel een eigen backend voor ons in**, als je die al hebt. Proxy‑instellingen in FlutterFlow, samen met een eigen proxy‑URL, zijn gedocumenteerd voor de builder en de Run‑ en Test‑modi; de documentatie zegt niets over de gepubliceerde web‑build, dus reken er niet op.

Een publieke sleutel `pk_` lost dit niet op: hij haalt alleen `/v1/public/*` en `/v1/embed/*` op, en wordt volledig afgewezen vanuit builds voor iOS en Android, omdat ze geen web‑origin sturen.

## Fouten

- **`401`** bij een privé‑oproep: de sleutel zit op de groep, niet op de oproep.
- **`400 INVALID_FIELD` met `timezone` in `details`**: zone is leeg, dit is een afkorting zoals `EST` of geen zone‑naam.
- **`400` met `date` of `time` in `details`**: formaat is niet `YYYY-MM-DD` / `HH:MM:SS`.
- **`403 ENDPOINT_NOT_IN_SCOPE`**: het gebied van de sleutel bevat geen `chart`.
- **`429 KEY_BUDGET_EXHAUSTED`**: de sleutel heeft zijn budget opgebruikt; verhoog het in het dashboard.

<Aside type="note">
Het gratis tarief van FlutterFlow staat twee API‑endpoints per project toe en heeft geen OpenAPI‑import, dus daar wordt de oproep handmatig toegevoegd, en er blijft nog één slot over. De API geocodeert niet: coördinaten worden gehaald uit je eigen velden of uit een geocodeer‑service waarvoor je een sleutel hebt.
</Aside>