Mengautentikasi aplikasi JavaScript ke layanan Azure selama pengembangan lokal menggunakan perwakilan layanan
Saat Anda membuat aplikasi cloud, pengembang perlu men-debug dan menguji aplikasi di stasiun kerja lokal mereka. Saat aplikasi dijalankan di stasiun kerja pengembang selama pengembangan lokal, aplikasi masih harus mengautentikasi ke setiap layanan Azure yang digunakan oleh aplikasi. Artikel ini membahas cara menyiapkan objek perwakilan layanan aplikasi khusus yang akan digunakan selama pengembangan lokal.
Perwakilan layanan aplikasi khusus untuk pengembangan lokal memungkinkan Anda untuk mengikuti prinsip hak istimewa paling sedikit selama pengembangan aplikasi. Karena izin dilingkup ke apa saja yang diperlukan untuk aplikasi selama pengembangan, kode aplikasi dicegah untuk mengakses sumber daya Azure secara tidak sengaja yang dimaksudkan untuk digunakan oleh aplikasi yang berbeda. Metode ini juga mencegah bug terjadi ketika aplikasi dipindahkan ke produksi karena aplikasi memiliki hak istimewa yang berlebihan di lingkungan dev.
Perwakilan layanan aplikasi disiapkan untuk aplikasi saat aplikasi terdaftar di Azure. Saat mendaftarkan aplikasi untuk pengembangan lokal, disarankan untuk:
- Membuat pendaftaran aplikasi terpisah untuk setiap pengembang yang bekerja di aplikasi. Metode ini membuat perwakilan layanan aplikasi terpisah untuk digunakan setiap pengembang selama pengembangan lokal dan menghindari kebutuhan pengembang untuk berbagi kredensial untuk satu perwakilan layanan aplikasi.
- Membuat pendaftaran aplikasi terpisah per aplikasi. Hal ini mencakup izin aplikasi hanya untuk apa yang diperlukan oleh aplikasi.
Selama pengembangan lokal, variabel lingkungan diatur dengan identitas perwakilan layanan aplikasi. Azure SDK untuk JavaScript membaca variabel lingkungan ini dan menggunakan informasi ini untuk mengautentikasi aplikasi ke sumber daya Azure yang dibutuhkan.
1 - Mendaftarkan aplikasi di Azure
Objek perwakilan layanan aplikasi dibuat dengan pendaftaran aplikasi di Azure. Anda dapat membuat perwakilan layanan menggunakan portal Azure atau Azure CLI.
Masuk ke portal Azure dan ikuti langkah-langkah berikut.
| Petunjuk | Cuplikan layar |
|---|---|
Di portal Azure:
|
|
| Pada halaman Pendaftaran aplikasi, pilih + Pendaftaran baru. | 
|
Pada halaman Daftarkan aplikasi, isi formulir sebagai berikut.
|
|
Pada halaman Pendaftaran aplikasi untuk aplikasi Anda:
|
|
| Pada halaman Sertifikat & rahasia, pilih + Rahasia klien baru. | 
|
Dialog Tambahkan rahasia klien akan muncul dari sisi kanan halaman. Dalam dialog ini:
|
|
| Pada halaman Sertifikat & rahasia , Anda akan ditampilkan nilai rahasia klien. Salin nilai ini ke lokasi sementara di editor teks karena Anda akan membutuhkannya di langkah mendatang. PENTING: Ini adalah satu-satunya waktu Anda akan melihat nilai ini. Setelah Keluar atau menyegarkan halaman ini, Anda tidak akan dapat melihat nilai ini lagi. Anda dapat menambahkan lebih banyak rahasia klien tanpa membatalkan rahasia klien ini, tetapi Anda tidak akan melihat nilai ini lagi. |
|
2 - Membuat grup keamanan Microsoft Entra untuk pengembangan lokal
Karena biasanya ada beberapa pengembang yang mengerjakan aplikasi, disarankan untuk membuat grup Microsoft Entra untuk merangkum peran (izin) yang dibutuhkan aplikasi dalam pengembangan lokal daripada menetapkan peran ke objek perwakilan layanan individual. Ini menawarkan keuntungan berikut.
- Setiap pengembang diyakinkan untuk memiliki peran yang sama yang ditetapkan karena peran ditetapkan di tingkat grup.
- Jika peran baru diperlukan untuk aplikasi, peran tersebut hanya perlu ditambahkan ke grup Microsoft Entra untuk aplikasi tersebut.
- Jika pengembang baru bergabung dengan tim, perwakilan layanan aplikasi baru dibuat untuk pengembang dan ditambahkan ke grup, memastikan pengembang memiliki izin yang tepat untuk bekerja di aplikasi.
| Petunjuk | Cuplikan layar |
|---|---|
| Navigasi ke halaman ID Microsoft Entra di portal Azure dengan mengetik ID Microsoft Entra ke dalam kotak pencarian di bagian atas halaman lalu pilih ID Microsoft Entra dari bawah layanan. | 
|
| Pada halaman ID Microsoft Entra, pilih Grup dari menu sebelah kiri. | 
|
| Pada halaman Semua grup, pilih Grup baru. | 
|
Pada halaman Grup Baru:
|
|
Pada kotak dialog Tambahkan anggota :
|
|
| Pada halaman Grup baru, pilih Buat untuk membuat grup. Grup akan dibuat dan Anda akan dibawa kembali ke halaman Semua grup. Mungkin perlu waktu hingga 30 detik agar grup muncul dan Anda mungkin perlu me-refresh halaman karena penembolokan di portal Microsoft Azure. |
|
3 - Menetapkan peran ke aplikasi
Selanjutnya, Anda perlu menentukan peran (izin) apa yang dibutuhkan aplikasi Anda pada sumber daya apa dan menetapkan peran tersebut ke aplikasi Anda. Dalam contoh ini, peran ditetapkan ke grup Microsoft Entra yang dibuat di langkah 2. Peran dapat diberi peran di sumber daya, grup sumber daya, atau cakupan langganan. Contoh ini menunjukkan cara menetapkan peran di cakupan grup sumber daya karena sebagian besar aplikasi mengelompokkan semua sumber daya Azure mereka ke dalam satu grup sumber daya.
| Petunjuk | Cuplikan layar |
|---|---|
| Temukan grup sumber daya untuk aplikasi Anda dengan mencari nama grup sumber daya menggunakan kotak pencarian di bagian atas portal Microsoft Azure. Navigasi ke grup sumber daya Anda dengan memilih nama grup sumber daya di bawah judul Grup Sumber Daya dalam kotak dialog. |
|
| Pada halaman untuk grup sumber daya, pilih Kontrol akses (IAM) dari menu sebelah kiri. | 
|
Pada halaman Kontrol akses (IAM):
|
|
Halaman Tambahkan penetapan peran mencantumkan semua peran yang dapat ditetapkan untuk grup sumber daya.
|
|
Halaman Tambahkan penetapan peran berikutnya memungkinkan Anda menentukan pengguna yang akan ditetapkan perannya.
|
|
Dalam dialog Pilih anggota:
|
|
| Grup Microsoft Entra ditampilkan seperti yang dipilih pada layar Tambahkan penetapan peran. Pilih Tinjau + tetapkan untuk masuk ke halaman akhir lalu Tinjau + tetapkan lagi untuk menyelesaikan proses. |
|
4 - Mengatur variabel lingkungan pengembangan lokal
Objek DefaultAzureCredential mencari informasi perwakilan layanan dalam sekumpulan variabel lingkungan saat runtime. Karena sebagian besar pengembang bekerja pada beberapa aplikasi, disarankan untuk menggunakan paket seperti dotenv untuk mengakses lingkungan dari file yang .env disimpan di direktori aplikasi selama pengembangan. Ini mencakup variabel lingkungan yang digunakan untuk mengautentikasi aplikasi ke Azure sehingga hanya dapat digunakan oleh aplikasi ini.
File .env tidak pernah diperiksa ke kontrol sumber karena berisi kunci rahasia aplikasi untuk Azure. File .gitignore standar untuk JavaScript secara otomatis mengecualikan .env file dari check-in.
Untuk menggunakan paket, pertama-tama dotenv instal paket di aplikasi Anda.
npm install dotenv
Kemudian, buat .env file di direktori akar aplikasi Anda. Atur nilai variabel lingkungan dengan nilai yang diperoleh dari proses pendaftaran aplikasi sebagai berikut:
AZURE_CLIENT_ID→ Nilai ID aplikasi.AZURE_TENANT_ID→ Nilai ID penyewa.AZURE_CLIENT_SECRET→ Kata sandi/mandat yang dihasilkan untuk aplikasi.
AZURE_CLIENT_ID=00000000-0000-0000-0000-000000000000
AZURE_TENANT_ID=11111111-1111-1111-1111-111111111111
AZURE_CLIENT_SECRET=abcdefghijklmnopqrstuvwxyz
Terakhir, dalam kode startup untuk aplikasi Anda, gunakan dotenv pustaka untuk membaca variabel lingkungan dari file saat .env startup.
import 'dotenv/config'
5 - Menerapkan DefaultAzureCredential di aplikasi Anda
Untuk mengautentikasi objek klien Azure SDK ke Azure, aplikasi Anda harus menggunakan DefaultAzureCredential kelas dari @azure/identity paket. Dalam skenario ini, DefaultAzureCredential mendeteksi variabel AZURE_CLIENT_IDlingkungan , , AZURE_TENANT_IDdan AZURE_CLIENT_SECRET diatur dan membaca variabel tersebut untuk mendapatkan informasi utama layanan aplikasi untuk terhubung ke Azure.
Mulailah dengan menambahkan paket @azure/identitas ke aplikasi Anda.
npm install @azure/identity
Selanjutnya, untuk kode JavaScript apa pun yang membuat objek klien Azure SDK di aplikasi, Anda harus:
DefaultAzureCredentialImpor kelas dari@azure/identitymodul.- Buat objek
DefaultAzureCredential. - Teruskan
DefaultAzureCredentialobjek ke konstruktor objek klien Azure SDK.
Contoh ini ditampilkan di segmen kode berikut.
// Azure authentication dependency
import { DefaultAzureCredential } from '@azure/identity';
// Azure resource management dependency
import { SubscriptionClient } from "@azure/arm-subscriptions";
// Acquire credential
const tokenCredential = new DefaultAzureCredential();
async function listSubscriptions() {
try {
// use credential to authenticate with Azure SDKs
const client = new SubscriptionClient(tokenCredential);
// get details of each subscription
for await (const item of client.subscriptions.list()) {
const subscriptionDetails = await client.subscriptions.get(
item.subscriptionId
);
/*
Each item looks like:
{
id: '/subscriptions/123456',
subscriptionId: '123456',
displayName: 'YOUR-SUBSCRIPTION-NAME',
state: 'Enabled',
subscriptionPolicies: {
locationPlacementId: 'Internal_2014-09-01',
quotaId: 'Internal_2014-09-01',
spendingLimit: 'Off'
},
authorizationSource: 'RoleBased'
},
*/
console.log(subscriptionDetails);
}
} catch (err) {
console.error(JSON.stringify(err));
}
}
listSubscriptions()
.then(() => {
console.log("done");
})
.catch((ex) => {
console.log(ex);
});
DefaultAzureCredential akan secara otomatis mendeteksi mekanisme autentikasi yang dikonfigurasi untuk aplikasi dan mendapatkan token yang diperlukan untuk mengautentikasi aplikasi ke Azure. Jika aplikasi menggunakan lebih dari satu klien SDK, objek kredensial yang sama dapat digunakan dengan setiap objek klien SDK.
Saran dan Komentar
Segera hadir: Sepanjang tahun 2024 kami akan menghentikan penggunaan GitHub Issues sebagai mekanisme umpan balik untuk konten dan menggantinya dengan sistem umpan balik baru. Untuk mengetahui informasi selengkapnya, lihat: https://aka.ms/ContentUserFeedback.
Kirim dan lihat umpan balik untuk