Bagikan melalui

Penyiapan login eksternal Google di ASP.NET Core

  • Artikel

Oleh Valeriy Novytskyy dan Rick Anderson

Tutorial ini menunjukkan kepada Anda cara memungkinkan pengguna untuk masuk dengan akun Google mereka menggunakan proyek ASP.NET Core yang dibuat di halaman sebelumnya.

Membuat ID dan rahasia Klien Google OAuth 2.0

  • Ikuti panduan dalam Mengintegrasikan Masuk Google ke aplikasi web Anda (dokumentasi Google).

  • Buka Google API &Services.

  • Proyek harus ada terlebih dahulu, Anda mungkin harus membuatnya. Setelah proyek dipilih, masukkan Dasbor.

  • Di layar persetujuan Oauth dasbor:

    • Pilih Jenis Pengguna - Eksternal dan BUAT.
    • Dalam dialog Informasi aplikasi, Berikan nama aplikasi untuk aplikasi, email dukungan pengguna, dan informasi kontak pengembang.
    • Menelusuri langkah Cakupan.
    • Langkah-langkah Uji pengguna .
    • Tinjau layar persetujuan OAuth dan kembali ke Dasbor aplikasi.

  • Di tab Kredensial dasbor aplikasi, pilih BUAT KREDENSIAL>ID klien OAuth.

  • Pilih Aplikasi jenis>aplikasi Web, pilih nama.

  • Di bagian URI pengalihan resmi, pilih TAMBAHKAN URI untuk mengatur URI pengalihan. Contoh URI pengalihan: https://localhost:{PORT}/signin-google, di mana {PORT} tempat penampung adalah port aplikasi.

  • Pilih tombol CREATE .

  • Simpan ID Klien dan Rahasia Klien untuk digunakan dalam konfigurasi aplikasi.

  • Saat menyebarkan situs, baik:

    • Perbarui URI pengalihan aplikasi di Konsol Google ke URI pengalihan yang disebarkan aplikasi.
    • Buat pendaftaran Google API baru di Google Console untuk aplikasi produksi dengan URI pengalihan produksinya.

Menyimpan ID dan rahasia klien Google

Simpan pengaturan sensitif seperti ID klien Google dan nilai rahasia dengan Secret Manager. Untuk sampel ini, gunakan langkah-langkah berikut:

  1. Inisialisasi proyek untuk penyimpanan rahasia per instruksi di Aktifkan penyimpanan rahasia.

  2. Simpan pengaturan sensitif di penyimpanan rahasia lokal dengan kunci Authentication:Google:ClientId rahasia dan Authentication:Google:ClientSecret:

    dotnet user-secrets set "Authentication:Google:ClientId" "<client-id>"
dotnet user-secrets set "Authentication:Google:ClientSecret" "<client-secret>"

Pemisah : tidak berfungsi dengan kunci hierarkis variabel lingkungan di semua platform. __, garis bawah ganda:

  • Didukung oleh semua platform. Misalnya, pemisah : tidak didukung oleh Bash, tetapi __ didukung.
  • Secara otomatis diganti dengan :

Anda dapat mengelola kredensial dan penggunaan API di Konsol API.

Mengonfigurasi autentikasi Google

Microsoft.AspNetCore.Authentication.Google Tambahkan paket NuGet ke aplikasi.

Tambahkan layanan Autentikasi ke Startup.ConfigureServices:

public void ConfigureServices(IServiceCollection services)
{
    services.AddDbContext<ApplicationDbContext>(options =>
        options.UseSqlServer(
            Configuration.GetConnectionString("DefaultConnection")));
    services.AddDefaultIdentity<IdentityUser>(options =>
        options.SignIn.RequireConfirmedAccount = true)
            .AddEntityFrameworkStores<ApplicationDbContext>();
    services.AddRazorPages();

    services.AddAuthentication()
        .AddGoogle(options =>
        {
            IConfigurationSection googleAuthNSection =
                Configuration.GetSection("Authentication:Google");

            options.ClientId = googleAuthNSection["ClientId"];
            options.ClientSecret = googleAuthNSection["ClientSecret"];
        });
}

Tambahkan layanan Autentikasi ke Program:

var builder = WebApplication.CreateBuilder(args);
var services = builder.Services;
var configuration = builder.Configuration;

services.AddAuthentication().AddGoogle(googleOptions =>
    {
        googleOptions.ClientId = configuration["Authentication:Google:ClientId"];
        googleOptions.ClientSecret = configuration["Authentication:Google:ClientSecret"];
    });

Panggilan untuk AddIdentity mengonfigurasi pengaturan skema default. Kelebihan AddAuthentication(IServiceCollection, String) beban mengatur DefaultScheme properti. Kelebihan AddAuthentication(IServiceCollection, Action<AuthenticationOptions>) beban memungkinkan konfigurasi opsi autentikasi, yang dapat digunakan untuk menyiapkan skema autentikasi default untuk tujuan yang berbeda. Panggilan berikutnya untuk AddAuthentication mengambil alih properti yang dikonfigurasi AuthenticationOptions sebelumnya.

AuthenticationBuilder metode ekstensi yang mendaftarkan handler autentikasi hanya dapat dipanggil sekali per skema autentikasi. Ada kelebihan beban yang memungkinkan konfigurasi properti skema, nama skema, dan nama tampilan.

Masuk dengan Google

  • Jalankan aplikasi dan pilih Masuk. Opsi untuk masuk dengan Google muncul.
  • Pilih tombol Google , yang mengalihkan ke Google untuk autentikasi.
  • Setelah memasukkan kredensial Google, Anda dialihkan kembali ke situs web.

Meneruskan informasi permintaan dengan proksi atau penyeimbang beban

Jika aplikasi disebarkan di belakang server proksi atau penyeimbang beban, beberapa informasi permintaan asli mungkin diteruskan ke aplikasi di header permintaan. Informasi ini biasanya mencakup skema permintaan aman (https), host, dan alamat IP klien. Aplikasi tidak secara otomatis membaca header permintaan ini untuk menemukan dan menggunakan informasi permintaan asli.

Skema ini digunakan dalam pembuatan tautan yang memengaruhi alur autentikasi dengan penyedia eksternal. Kehilangan skema aman (https) akan menyebabkan aplikasi menghasilkan URL pengalihan tidak aman yang salah.

Pakai Forwarded Headers Middleware guna menyediakan informasi permintaan asli untuk aplikasi untuk pemrosesan permintaan.

Untuk informasi selengkapnya, lihat Mengonfigurasi ASP.NET Core untuk bekerja dengan server proxy dan memuat penyeimbang.

Beberapa penyedia autentikasi

Saat aplikasi memerlukan beberapa penyedia, rantai metode ekstensi penyedia di belakang AddAuthentication:

services.AddAuthentication()
    .AddMicrosoftAccount(microsoftOptions => { ... })
    .AddGoogle(googleOptions => { ... })
    .AddTwitter(twitterOptions => { ... })
    .AddFacebook(facebookOptions => { ... });

Untuk informasi selengkapnya tentang opsi konfigurasi yang didukung oleh autentikasi Google, lihat GoogleOptions referensi API . Ini dapat digunakan untuk meminta informasi yang berbeda tentang pengguna.

Mengubah URI panggilan balik default

Segmen /signin-google URI ditetapkan sebagai panggilan balik default penyedia autentikasi Google. Anda dapat mengubah URI panggilan balik default saat mengonfigurasi middleware autentikasi Google melalui properti kelas yang GoogleOptions diwariskanRemoteAuthenticationOptions.CallbackPath.

Pemecahan Masalah

  • Jika rincian masuk tidak berfungsi dan Anda tidak mendapatkan kesalahan apa pun, beralihlah ke mode pengembangan untuk membuat masalah lebih mudah di-debug.
  • Jika Identity tidak dikonfigurasi dengan memanggil services.AddIdentity , ConfigureServicesmencoba mengautentikasi hasil di ArgumentException: Opsi 'SignInScheme' harus disediakan. Templat proyek yang digunakan dalam tutorial ini memastikan Identity dikonfigurasi.
  • Jika database situs belum dibuat dengan menerapkan migrasi awal, Anda mendapatkan operasi database gagal saat memproses kesalahan permintaan . Pilih Terapkan Migrasi untuk membuat database, dan refresh halaman untuk melanjutkan kesalahan.
  • Kesalahan HTTP 500 setelah berhasil mengautentikasi permintaan oleh penyedia OAuth 2.0 seperti Google: Lihat masalah GitHub ini.
  • Cara menerapkan autentikasi eksternal dengan Google untuk React dan aplikasi SPA lainnya: Lihat masalah GitHub ini.

Langkah berikutnya

  • Artikel ini menunjukkan cara mengautentikasi dengan Google. Anda dapat mengikuti pendekatan serupa untuk mengautentikasi dengan penyedia lain yang tercantum di halaman sebelumnya.
  • Setelah Anda memublikasikan aplikasi ke Azure, reset ClientSecret di Konsol Google API.
  • Atur Authentication:Google:ClientId pengaturan aplikasi dan Authentication:Google:ClientSecret sebagai di portal Azure. Sistem konfigurasi disiapkan untuk membaca kunci dari variabel lingkungan.