Dukungan API di Azure Static Web Apps dengan Azure Functions

Aplikasi web ujung depan sering memanggil API back-end untuk data dan layanan. Secara default, Azure Static Web Apps menyediakan titik akhir API tanpa server bawaan melalui Azure Functions.

AZURE FUNCTIONS API di Static Web Apps tersedia dalam dua konfigurasi yang mungkin tergantung pada paket hosting:

  • Fungsi terkelola: Secara default, API aplikasi web statis adalah aplikasi Azure Functions yang dikelola dan disebarkan oleh Azure Static Web Apps terkait dengan beberapa batasan.

  • Provisi fungsi Anda sendiri: Secara opsional, Anda dapat provisi aplikasi Azure Functions yang ada dari jenis paket apa pun, yang mencakup semua fitur Azure Functions. Dengan konfigurasi ini, Anda bertanggung jawab untuk menangani penyebaran terpisah untuk aplikasi Functions.

Tabel berikut membandingkan perbedaan antara menggunakan fungsi terkelola dan yang sudah ada.

Fitur Fungsi Terkelola Bawa Fungsi Anda Sendiri
Akses ke Azure Functions trigger dan pengikatan Hanya HTTP Semua
Azure Functions runtimes yang didukung1 Lihat bahasa dan runtime yang didukung. Semua
Paket Azure Functions hosting yang didukung Konsumsi Konsumsi
Premium
Khusus
Keamanan terintegrasi dengan akses langsung ke autentikasi pengguna dan data otorisasi berbasis peran
Integrasi perutean yang membuat /api rute tersedia untuk aplikasi web dengan aman tanpa memerlukan aturan CORS kustom.
model pemrograman Durable Functions
Identitas terkelola
Azure App Service Autentikasi dan Otorisasi manajemen token
Fungsi API tersedia di luar Azure Static Web Apps
Key Vault referensi

1 Untuk menentukan versi runtime dalam fungsi terkelola, tambahkan file konfigurasi ke aplikasi frontend Anda dan atur apiRuntime properti . Dukungan tunduk pada kebijakan dukungan runtime bahasa Azure Functions.

Opsi API untuk Static Web Apps mencakup layanan Azure berikut:

Lihat gambaran umum API untuk informasi selengkapnya.

Konfigurasi

Titik akhir API tersedia untuk aplikasi web melalui api rute.

Fungsi terkelola Membawa fungsi milik Anda
/api Meskipun rutenya tetap, Anda memiliki kontrol atas lokasi folder kode sumber untuk aplikasi fungsi yang dikelola. Anda dapat mengubah lokasi ini dengan mengedit file YAML alur kerja yang terletak di folder .github/workflows repositori Anda. Permintaan ke rute /api dikirim ke aplikasi Azure Functions yang ada.

Pemecahan masalah dan catatan log

Log hanya tersedia jika Anda menambahkan Application Insights.

Fungsi terkelola Membawa fungsi milik Anda
Aktifkan pengelogan dengan mengaktifkan Application Insights di aplikasi web statis Anda. Aktifkan pengelogan dengan mengaktifkan Application Insights di aplikasi Azure Functions Anda.

Kendala

Selain STATIC WEB APPS API constraints, pembatasan berikut juga berlaku untuk API Azure Functions:

Fungsi terkelola Membawa fungsi milik Anda
  • Pemicu dan pengikatan terbatas pada HTTP.
  • Aplikasi Azure Functions harus berada di Node.js 12, Node.js 14, Node.js 16, Node.js 18, Node.js 20 (pratinjau), .NET Core 3.1, .NET 6.0, .NET 7.0, .NET 8.0, Python 3.8, Python 3.9, atau Python 3.10.
  • Beberapa pengaturan aplikasi dikelola oleh layanan, oleh karena itu awalan berikut dipesan oleh runtime:
    • APPSETTING_, AZUREBLOBSTORAGE_, AZUREFILESSTORAGE_, AZURE_FUNCTION_, CONTAINER_, DIAGNOSTICS_, DOCKER_, FUNCTIONS_, IDENTITY_, MACHINEKEY_, MAINSITE_, MSDEPLOY_, SCMSITE_, SCM_, WEBSITES_, WEBSITE_, WEBSOCKET_, AzureWeb
  • Beberapa tag aplikasi digunakan secara internal oleh layanan. Oleh karena itu, tag berikut dicadangkan:
    • AccountId, EnvironmentId, FunctionAppId.
  • Anda bertanggung jawab untuk mengelola penyebaran aplikasi Functions.

Langkah berikutnya