Mulai cepat: Debug ASP.NET Core dengan debugger Visual Studio

Dalam Mulai Cepat ini, Anda menjelajahi cara menggunakan debugger Visual Studio untuk men-debug kode aplikasi ASP.NET Core Anda. Artikel ini menyediakan cara cepat untuk mempelajari beberapa fitur dasar untuk bekerja di debugger.

Jika Anda tidak memiliki Visual Studio, Anda dapat menginstal versi uji coba free dari halaman Unduhan Visual Studio.

Membuat proyek baru

Mulailah dengan membuat proyek baru, jadi Anda memiliki beberapa kode untuk memeriksa debugger.

  1. Buka Visual Studio dan buat proyek baru.

    • Jika Jendela Mulai tidak terbuka, pilihJendela Mulai>.

    • Di Jendela Mulai, pilih Buat proyek baru.

  2. Di jendela Buat proyek baru , atur filter dan cari templat proyek.

    • Dalam kotak Cari templat , masukkan aplikasi web.

    • Perluas menu dropdown Bahasa dan pilih C#.

  3. Dalam daftar hasil, pilih templat ASP.NET Core Web App (Razor Pages) untuk C#, lalu pilih Baru.

    Jika Anda tidak melihat templat ASP.NET Core Web App (Razor Pages) untuk C#, pilih opsi Kontinu tanpa kode.

    1. Pilih Tools>Dapatkan Alat dan Fitur... , yang membuka Visual Studio Installer.

    2. Di jendela Penginstal, pilih kotak centang untuk ASP.NET dan pengembangan web beban kerja, lalu pilih Modify.

      Pembaruan penginstalan Visual Studio Anda untuk menyertakan beban kerja ASP.NET yang dipilih.

    3. Setelah pembaruan selesai, pilihJendela Mulai>, dan ikuti instruksi sebelumnya untuk memilih templat yang diperlukan.

  4. Konfigurasikan proyek baru:

    1. Masukkan nama Project dan nama Solution, atau gunakan nilai default.

    2. Gunakan Lokasi default atau pilih telusuri (...) untuk membuat proyek di folder lain.

    3. Pilih Selanjutnya.

    4. Gunakan target yang direkomendasikan Framework (defaultnya adalah .NET 10.0 Dukungan Jangka Panjang).

    5. Untuk pengaturan lainnya, gunakan nilai default.

    6. Pilih Buat.

    Visual Studio membuat proyek baru Anda dan menambahkan file proyek di folder yang ditentukan.

Memperbarui kode proyek

Perbarui beberapa kode yang disediakan oleh templat proyek sehingga Anda memiliki lebih banyak pernyataan untuk diuji di debugger.

  1. Di panel Penjelajah Solusi, perluas simpul <proyek>\Pages, dan pilih item Privacy.cshtml.

    File Privacy.cshtml terbuka di editor kode.

  2. Temukan bagian kode berikut dalam file dan ganti dengan cuplikan yang disediakan:

    @{
     ViewData["Title"] = "Privacy Policy";
    }
    

    Cuplikan pengganti:

    @{
     ViewData["Title"] = "Privacy Policy";
     <label>@PrivacyModel.PrivacyMessage</label>
    }
    
  3. Dalam Penjelajah Solusi, perluas simpul <proyek>\Pages\Privacy.cshtml, dan pilih item Privacy.cshtml.cs.

    File Privacy.cshtml.cs terbuka di editor kode.

  4. Temukan bagian kode berikut dalam file dan ganti dengan cuplikan yang disediakan:

    public void OnGet()
    {
    }
    

    Cuplikan pengganti:

    
    public static string? PrivacyMessage { get; set; }
    
    public void OnGet() {
       LinkedList<int> result = DoWork();
    
       PrivacyMessage = "Result of work: " + result.First.Value + ", " + result.First.Value;
    }
    
    private static LinkedList<int> DoWork() {
       LinkedList<int> c1 = new();
    
       c1.AddLast(10);
       c1.AddLast(20);
    
       LinkedList<int> c2 = new(c1);
       return c2;
    }
    

Mengatur titik henti

breakpoint adalah penanda yang menunjukkan di mana Visual Studio harus menghentikan sementara eksekusi kode yang sedang berjalan. Saat titik henti diatur, Anda dapat melihat nilai variabel saat ini, memeriksa perilaku memori, dan memeriksa apakah cabang kode tertentu berjalan. Breakpoint adalah fitur yang paling dasar dalam debugging.

  1. Untuk mengatur titik henti, temukan panggilan ke DoWork fungsi dalam kode, lalu pilih di selokan kiri pada baris yang sama.

    Saat titik henti ditetapkan, sebuah titik merah muncul di margin kiri pada baris kode yang sesuai.

    Screenshot yang menunjukkan cara mengatur titik henti di Visual Studio debugger.

    Screenshot yang menunjukkan cara mengatur titik henti di debugger Visual Studio 2022.

  2. Mulai penelusuran kesalahan dengan menggunakan pintasan keyboard F5 (atau pilih Debug>Mulai Penelusuran Kesalahan).

  3. Saat halaman web terbuka di jendela browser, pilih tautan Privasi di bagian atas halaman.

    Eksekusi kode dihentikan sementara tepat sebelum pemanggilan fungsi DoWork.

    Debugger berhenti di tempat Anda mengatur titik henti. Panah kuning mengidentifikasi pernyataan di mana debugger menjeda eksekusi aplikasi.

    Cuplikan layar yang memperlihatkan debugger dalam keadaan dijeda pada titik henti yang telah ditetapkan di Visual Studio.

    Cuplikan layar yang menampilkan debugger yang dijeda pada titik henti yang telah ditetapkan di Visual Studio 2022.

Atur titik henti bersyarat

Jika Anda mengatur titik henti dalam perulangan atau rekursi, atau jika Anda memiliki banyak titik henti yang sering Dilalui, gunakan titik henti kondisional.

Pendekatan ini membantu memastikan kode Anda ditangguhkan hanya ketika kondisi tertentu terpenuhi. Titik henti kondisional dapat menghemat waktu dan juga memudahkan untuk men-debug masalah yang sulit direproduksi.

Menelusuri kode Anda

Visual Studio menyediakan beberapa cara berbeda untuk menginstruksikan debugger untuk melanjutkan eksekusi aplikasi. Contoh berikut menunjukkan perintah yang berguna untuk menelusuri kode Anda.

Saat kode dijeda di titik henti, arahkan mouse ke atas pernyataan return c2; hingga Anda melihat ikon Jalankan untuk mengklik hijau (Jalankan eksekusi ke sini). Pilih ikon .

Cuplikan layar yang menunjukkan cara menggunakan tindakan Run to Click dalam debugger Visual Studio.

Cuplikan layar yang memperlihatkan cara menggunakan aksi Jalankan hingga klik yang ada di debugger Visual Studio 2022.

Aplikasi melanjutkan eksekusi, dan menjeda pada baris kode tempat Anda mengklik tombol .

Perintah keyboard umum yang digunakan untuk menelusuri kode termasuk F10 dan F11. Untuk instruksi yang lebih mendalam, lihat Pertama-tama lihat debugger.

Memeriksa variabel dalam tip data

Anda dapat memeriksa status variabel Anda dengan menggunakan fitur tip data .

  1. Pada baris kode saat ini (ditandai oleh penunjuk eksekusi kuning), arahkan kursor ke objek c2 untuk melihat tooltip data.

    Cuplikan layar yang menunjukkan cara melihat info data untuk variabel kode di debugger Visual Studio.

    Cuplikan layar yang menunjukkan cara melihat tip data untuk variabel kode di debugger Visual Studio 2022.

    Tips data menunjukkan nilai c2 variabel saat ini dan memungkinkan Anda memeriksa propertinya.

    Saat Anda melakukan debug, jika Anda melihat nilai variabel yang tidak terduga, kemungkinan ada bug. Bug dapat berada dalam kode yang melakukan panggilan ke variabel atau di baris sebelumnya.

  2. Perluas tip data untuk melihat nilai properti dari objek c2 saat ini.

  3. Untuk terus memeriksa nilai c2 saat kode dieksekusi, pilih ikon sematkan pada tooltip data.

    Aksi sematkan membuat keterangan data tetap terbuka. Saat kode dijalankan, nilai dalam tip yang disematkan berubah untuk menampilkan status objek yang diawasi saat ini.

    Anda dapat memindahkan tooltip yang disematkan ke lokasi mana pun di IDE, sehingga tidak menghalangi Anda untuk memantau item lain saat melakukan debug.

Langkah selanjutnya