Mengonfigurasi CORS

  • 3 menit

API telah dibuat dan Anda siap untuk menghubungkan aplikasi web front-end dan benar-benar melihat proyek ini bekerja. Tetapi sebelum Anda dapat melakukannya, Anda harus memberi tahu API bahwa aplikasi front-end boleh memanggilnya. Koneksi ini dibuat dengan sesuatu yang disebut Berbagi Sumber Daya Lintas Asal, atau CORS.

Mengubah pengaturan CORS untuk aplikasi Azure Functions lokal

Anda dapat menentukan domain dan port yang didengarkan API Anda. Tentukan properti CORS di bawah Host dalam file local.settings.json di folder proyek fungsi utama. File local.settings.json adalah file yang sama tempat Anda menyimpan database string koneksi.

Umum dalam pengembangan untuk mengatur nilai CORS ke "*". Artinya "*" semua orang dan hewan peliharaan mereka (meskipun hewan peliharaan mengalami kesulitan mengetik) dapat mengakses API ini. CORS hanyalah pengaturan yang Anda butuhkan di lingkungan produksi, jadi pada dasarnya akan membantu jika Anda menonaktifkannya selama pengembangan.

{
  "IsEncrypted": false,
  "Values": {
    "AzureWebJobsStorage": "",
    "FUNCTIONS_WORKER_RUNTIME": "node",
    "AzureWebJobsFeatureFlags": "EnableWorkerIndexing",
    "CONNECTION_STRING": "AccountEndpoint=https://tailwind-traders-2778.documents.azure.com..."
  },
  "Host": {
    "CORS": "*"
  }
}

Peringatan

* wildcard untuk pengaturan CORS baik-baik saja untuk pengembangan, tetapi berbahaya dalam produksi. Saat mengonfigurasi CORS pada aplikasi Azure Functions yang disebarkan, pengaturan aplikasi harus diubah ke URL aplikasi front-end saat API ini disebarkan ke produksi.

Karena pengembang cerdas Anda (Tailwind Traders sangat beruntung memiliki Anda), Anda mengonfigurasi API untuk memungkinkan akses selama pengembangan. Sekarang Anda dapat menyalakan ujung depan dan melihat aplikasi Manajer Produk dalam semua kemuliaannya.