# FlutterFlow

FlutterFlow dikompilasi menjadi aplikasi yang dipegang oleh pengguna Anda, jadi pertanyaannya bukan tentang bidang apa yang harus diisi, tetapi di mana kunci akan berada. Permintaan di bawah ini dikirim ke produksi persis seperti yang dibuat oleh panggilan; langkah-langkah di FlutterFlow ditulis sesuai dokumentasi FlutterFlow per 2026-09-17.

Pertama, buat kunci seperti dijelaskan di bagian [Kunci untuk Otomatisasi](/integrations/#kunci-untuk-otomatisasi), dengan area `chart`.

<Aside type="caution" title="Kunci dalam panggilan biasa pergi bersama aplikasi">
Panggilan yang tidak ditandai sebagai privat dieksekusi dari perangkat, dan header-nya berada di dalam build yang dikompilasi untuk iOS, Android, dan web, di mana siapa pun bisa membacanya. Buat panggilan menjadi **privat**: maka FlutterFlow menjalankannya melalui Firebase Cloud Function, dan kunci tetap di server. Pemeriksaan sendiri FlutterFlow ini adalah mengunduh kode proyek dan mencari kunci dalam file frontend, dan ini hanya tersedia pada tarif berbayar.
</Aside>

## 1. Buat panggilan

Buka **API Calls**, tekan **+ Add**, pilih **Create API Call** dan isi:

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

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

- Tab **Headers**, **+ Add Header**: satu baris `X-Api-Key: ` dan kemudian kunci Anda. Baris kedua `Content-Type: application/json`.
- Tab **Variables**: lima variabel tipe String, `date`, `time`, `timezone`, `latitude`, `longitude`, masing-masing dengan nilai default dari JSON di bawah.
- Tab **Body**, di dropdown **JSON**: masukkan JSON dan seret variabel ke dalamnya.

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

Lintang dan bujur tetap string sengaja: API menerima `"50.45"` sebagai angka, dan string menyederhanakan penyeretan variabel.

Tekan **Add Call**, buka **Response & Test**, tekan **Test API Call** dan lihat respons di **Test Response**. `data.input.timezoneOffset` kembali sebagai `4`: itulah pergeseran Kiev pada tanggal tersebut.

## 2. Buat panggilan menjadi privat

Di **Advanced Settings** panggilan, aktifkan **Make Private**, tekan **Save**, lalu **Deploy APIs**. Sekarang panggilan dieksekusi di Firebase Cloud Function, jadi proyek memerlukan Firebase yang terhubung dan tarif Firebase dengan Cloud Functions.

<Aside type="caution" title="Panggilan privat tidak mewarisi header grup">
Jika Anda menempatkan kunci di **API Group**, bukan di panggilan itu sendiri, FlutterFlow berhenti mengirimkannya pada saat yang sama ketika panggilan menjadi privat: header grup tidak diwarisi oleh panggilan privat. Tambahkan `X-Api-Key` di panggilan itu sendiri, jika tidak, peluncuran privat pertama akan mengembalikan `401`.
</Aside>

Masih dua hal lagi yang dokumentasi FlutterFlow sebutkan secara langsung: kunci yang diteruskan dari frontend, misalnya melalui remote config, tetap terbuka bahkan di panggilan privat, dan bentuk aman itu header yang ditulis di panggilan itu sendiri.

## 3. Baca respons

Di **JSON Paths**, tekan **+ Add JSON Path** dan beri nama masing-masing:

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

Tanda itu adalah lintang, dibagi 30 dan dibulatkan ke bawah, sebagai indeks dalam daftar dua belas nama: misalnya Asenden `159.26` memberikan `5`, yaitu Virgo. Cukup fungsi kustom empat baris atau daftar dua belas baris dan indeksnya.

## Build web tidak dapat menghubungi kami dari browser

Diukur pada 2026-09-17 dari halaman di domain pihak ketiga: `POST /v1/chart` merespons preflight tanpa header `access-control-allow-origin`, dan Chrome memblokir permintaan. Browser di domain pihak ketiga hanya merespons `/v1/public/*` dan `/v1/embed/*`.

FlutterFlow menjalankan panggilan melalui proksi sendiri di builder, di Run mode dan Test mode, jadi panggilan yang bekerja di sana bisa gagal setelah publikasi web aplikasi. Dua solusi, dan yang pertama kami rekomendasikan:

- **Buat panggilan menjadi privat**, seperti di atas. Maka dieksekusi di Cloud Function, bukan di browser, dan ini langsung menyelesaikan masalah kunci dan masalah CORS.
- **Pasang backend Anda sendiri** di depan kami, jika Anda sudah memilikinya. Pengaturan proksi di FlutterFlow, bersama dengan proxy URL Anda sendiri, didokumentasikan untuk builder dan mode Run dan Test; tentang build web yang dipublikasikan, dokumentasi tidak mengatakan apa-apa, jadi tidak boleh bergantung padanya di sana.

Kunci publik `pk_` tidak menyelesaikan ini: itu hanya mendapatkan `/v1/public/*` dan `/v1/embed/*`, dan dari build untuk iOS dan Android ditolak sama sekali, karena mereka tidak mengirim web-origin.

## Kesalahan

- **`401`** di panggilan privat: kunci berada di grup, bukan di panggilan.
- **`400 INVALID_FIELD` dengan `timezone` di `details`**: zona kosong, itu adalah singkatan seperti `EST` atau bukan nama zona.
- **`400` dengan `date` atau `time` di `details`**: formatnya bukan `YYYY-MM-DD` / `HH:MM:SS`.
- **`403 ENDPOINT_NOT_IN_SCOPE`**: area kunci tidak memiliki `chart`.
- **`429 KEY_BUDGET_EXHAUSTED`**: kunci telah menghabiskan anggarannya; naikkan di dashboard.

<Aside type="note">
Tarif gratis FlutterFlow mengizinkan dua endpoint API per proyek dan tidak memiliki impor OpenAPI, jadi di sana panggilan ditambahkan secara manual, dan masih tersisa satu slot. API tidak melakukan geocoding: koordinat diambil dari field Anda sendiri atau dari layanan geocoding yang Anda memiliki kuncinya.
</Aside>