Mulai Cepat: Membuat aplikasi ASP.NET Core dengan Azure App Configuration

Artikel
03/05/2024

Dalam mulai cepat ini, Anda akan menggunakan Azure App Configuration untuk eksternalisasi penyimpanan dan manajemen pengaturan aplikasi Anda untuk aplikasi ASP.NET Core. ASP.NET Core membangun satu objek konfigurasi berbasis nilai kunci menggunakan pengaturan dari satu atau beberapa penyedia konfigurasi. App Configuration menawarkan pustaka penyedia konfigurasi .NET. Oleh karena itu, Anda dapat menggunakan App Configuration sebagai sumber konfigurasi tambahan untuk aplikasi Anda. Jika Anda memiliki aplikasi yang sudah ada, untuk mulai menggunakan App Configuration, Anda hanya memerlukan beberapa perubahan kecil pada kode startup aplikasi Anda.

Prasyarat

Akun Azure dengan langganan aktif. Buat akun gratis.
Penyimpanan App Configuration. Buat toko.
.NET SDK 6.0 atau yang lebih baru

Tip

Azure Cloud Shell adalah shell interaktif gratis yang dapat Anda gunakan untuk menjalankan langkah-langkah dalam artikel ini. Ini memiliki alat Azure umum yang telah diinstal sebelumnya, termasuk .NET SDK. Jika Anda masuk ke langganan Azure, luncurkan Azure Cloud Shell dari shell.azure.com. Anda dapat mempelajari selengkapnya mengenai Azure Cloud Shell dengan membaca dokumentasi kami

Menambahkan nilai kunci

Tambahkan nilai kunci berikut ke penyimpanan App Configuration dan biarkan Label dan Tipe Konten dengan nilai defaultnya. Untuk informasi selengkapnya tentang cara menambahkan nilai kunci ke penyimpanan menggunakan portal Azure atau CLI, buka Membuat nilai kunci.

Tombol	Nilai
TestApp:Pengaturan:BackgroundColor	putih
TestApp:Pengaturan:FontColor	hitam
TestApp:Settings:FontSize	24
TestApp:Pengaturan:Message	Data dari Azure App Configuration

Buat aplikasi web ASP.NET Core

Gunakan antarmuka baris perintah (CLI) .NET untuk membuat proyek aplikasi web ASP.NET Core baru. Azure Cloud Shell menyediakan alat tersebut untuk Anda. Alat tersebut juga tersedia di seluruh platform Windows, macOS, dan Linux.

Jalankan perintah berikut untuk membuat aplikasi web ASP.NET Core di folder TestAppConfig baru:

dotnet new webapp --output TestAppConfig --framework net6.0

Hubungkan ke penyimpanan Azure App Configuration

Navigasikan ke direktori proyek TestAppConfig, dan jalankan perintah berikut untuk menambahkan referensi paket NuGet Microsoft.Azure.AppConfiguration.AspNetCore :
```
dotnet add package Microsoft.Azure.AppConfiguration.AspNetCore
```
Jalankan perintah berikut. Perintah menggunakan Secret Manager untuk menyimpan rahasia bernama ConnectionStrings:AppConfig, yang menyimpan string koneksi untuk penyimpanan App Configuration Anda. Ganti tempat penampung <your_connection_string> dengan string koneksi penyimpanan Azure App Configuration Anda. Anda dapat menemukan string koneksi di bawah Kunci Akses penyimpanan App Configuration Anda di portal Azure.
```
dotnet user-secrets init
dotnet user-secrets set ConnectionStrings:AppConfig "<your_connection_string>"
```
Tip

Beberapa shell akan menghilangkan string koneksi, kecuali string berada dalam tanda kutip. Pastikan bahwa output perintah dotnet user-secrets list menampilkan seluruh string koneksi. Jika tidak, silakan jalankan ulang perintah dengan menyertakan string koneksi dalam tanda kutip.

Secret Manager menyimpan rahasia di luar pohon proyek Anda, yang membantu mencegah berbagi rahasia yang tidak disengaja dalam kode sumber. Ini hanya digunakan untuk menguji aplikasi web secara lokal. Saat aplikasi disebarkan ke Azure seperti App Service, gunakan string Koneksi ion, Pengaturan aplikasi, atau variabel lingkungan untuk menyimpan string koneksi. Atau, untuk menghindari string koneksi bersama-sama, Anda dapat terhubung ke App Configuration menggunakan identitas terkelola atau identitas Microsoft Entra Anda lainnya.
Buka Program.cs dan tambahkan Azure App Configuration sebagai sumber konfigurasi tambahan dengan memanggil AddAzureAppConfiguration metode .
```
var builder = WebApplication.CreateBuilder(args);

// Retrieve the connection string
string connectionString = builder.Configuration.GetConnectionString("AppConfig");

// Load configuration from Azure App Configuration
builder.Configuration.AddAzureAppConfiguration(connectionString);

// The rest of existing code in program.cs
// ... ...
```
Kode ini akan terhubung ke penyimpanan App Configuration Anda menggunakan string koneksi dan memuat semua nilai kunci yang tidak memiliki label. Untuk informasi selengkapnya tentang penyedia App Configuration, lihat referensi API penyedia App Configuration.

Baca dari penyimpanan App Configuration

Dalam contoh ini, Anda akan memperbarui halaman web untuk menampilkan kontennya menggunakan pengaturan yang Anda konfigurasi di penyimpanan App Configuration Anda.

Tambahkan file Pengaturan.cs di akar direktori proyek Anda. Ini mendefinisikan kelas yang sangat ditik Settings untuk konfigurasi yang akan Anda gunakan. Ganti ruang nama dengan nama proyek Anda.

namespace TestAppConfig
{
    public class Settings
    {
        public string BackgroundColor { get; set; }
        public long FontSize { get; set; }
        public string FontColor { get; set; }
        public string Message { get; set; }
    }
}

Ikat bagian TestApp:Settings dalam konfigurasi ke Settings objek.

Perbarui Program.cs dengan kode berikut dan tambahkan TestAppConfig namespace di awal file.

using TestAppConfig;

// Existing code in Program.cs
// ... ...

builder.Services.AddRazorPages();

// Bind configuration "TestApp:Settings" section to the Settings object
builder.Services.Configure<Settings>(builder.Configuration.GetSection("TestApp:Settings"));

var app = builder.Build();

// The rest of existing code in program.cs
// ... ...

Buka Index.cshtml.cs di direktori Pages , dan perbarui IndexModel kelas dengan kode berikut. using Microsoft.Extensions.Options Tambahkan namespace layanan di awal file, jika belum ada.

public class IndexModel : PageModel
{
    private readonly ILogger<IndexModel> _logger;

    public Settings Settings { get; }

    public IndexModel(IOptionsSnapshot<Settings> options, ILogger<IndexModel> logger)
    {
        Settings = options.Value;
        _logger = logger;
    }
}

Buka Index.cshtml di direktori Pages , dan perbarui konten dengan kode berikut.

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

<style>
    body {
        background-color: @Model.Settings.BackgroundColor;
    }

    h1 {
        color: @Model.Settings.FontColor;
        font-size: @(Model.Settings.FontSize)px;
    }
</style>

<h1>@Model.Settings.Message</h1>

Membangun dan menjalankan aplikasi secara lokal

Untuk membuat aplikasi menggunakan .NET CLI, navigasikan ke direktori akar proyek Anda. Jalankan perintah berikut pada shell perintah:
```
dotnet build
```
Setelah pembangunan berhasil diselesaikan, jalankan perintah berikut untuk menjalankan aplikasi secara lokal:
```
dotnet run
```
Output dotnet run perintah berisi dua URL. Buka browser dan navigasi ke salah satu URL ini untuk mengakses aplikasi Anda. Sebagai contoh: https://localhost:5001.

Jika Anda bekerja pada Azure Cloud Shell, pilih tombol Pratinjau Web diikuti dengan Konfigurasikan. Ketika diminta untuk mengonfigurasi port untuk pratinjau, masukkan 5000, dan pilih Buka dan telusuri.

Halaman web terlihat seperti ini:

Membersihkan sumber daya

Jika Anda tidak ingin terus menggunakan sumber daya yang dibuat dalam artikel ini, hapus grup sumber daya yang Anda buat di sini untuk menghindari biaya.

Penting

Penghapusan grup sumber daya tidak bisa dipulihkan. Grup sumber daya dan semua sumber daya yang ada di dalamnya akan dihapus secara permanen. Pastikan Anda tidak menghapus grup atau sumber daya yang salah secara tidak sengaja. Jika Anda membuat sumber daya untuk artikel ini dalam grup sumber daya yang ada yang berisi sumber daya lain yang ingin disimpan, hapus setiap sumber daya satu per satu dari panelnya masing-masing, bukan menghapus grup sumber daya.

Masuk ke portal Azure, lalu pilih Grup sumber daya.
Dalam kotak Filter menurut nama, masukkan nama grup sumber daya Anda.
Dalam daftar hasil, pilih nama grup sumber daya untuk melihat gambaran umum.
Pilih Hapus grup sumber daya.
Anda akan diminta untuk mengonfirmasi penghapusan grup sumber daya. Masukkan nama grup sumber daya Anda untuk mengonfirmasi, dan pilih Hapus.

Setelah beberapa saat, grup sumber daya dan semua sumber dayanya akan dihapus.

Langkah berikutnya

Dalam mulai cepat ini, Anda akan:

Menyediakan penyimpanan Azure App Configuration baru.
Koneksi ke penyimpanan App Configuration Anda menggunakan pustaka penyedia App Configuration.
Baca nilai kunci penyimpanan App Configuration Anda dengan pustaka penyedia konfigurasi.
Menampilkan halaman web menggunakan pengaturan yang Anda konfigurasi di penyimpanan App Configuration Anda.

Untuk mempelajari cara mengonfigurasi aplikasi web ASP.NET Core Anda untuk menyegarkan pengaturan konfigurasi secara dinamis, lanjutkan ke tutorial berikutnya.

Mengaktifkan konfigurasi dinamis