ASP.NET Core의 Google 외부 로그인 설정

  • 아티클

작성자: Valeriy Novytskyy 및 Rick Anderson

이 자습서에서는 사용자가 이전 페이지에서 만든 ASP.NET Core 프로젝트를 사용하여 Google 계정으로 로그인할 수 있도록 하는 방법을 보여 줍니다.

Google OAuth 2.0 클라이언트 ID 및 비밀 만들기

  • Google 로그인을 웹앱에 통합(Google 설명서)에 나와 있는 지침을 따릅니다.

  • Google API 및 서비스로 이동합니다.

  • 프로젝트가 먼저 존재하여야 하므로, 새로 생성하여야 할 수 있습니다. 프로젝트를 선택한 이후 대시보드를 입력합니다.

  • 대시보드의 Oauth 동의 화면에서 다음을 수행합니다.

    • 사용자 유형 - 외부 및 만들기를 선택합니다.
    • 앱 정보 대화 상자에서 앱의 앱 이름, 사용자 지원 전자 메일 및 개발자 연락처 정보를 제공합니다.
    • 범위 단계를 각각 수행합니다.
    • 사용자 테스트 단계를 각각 수행합니다.
    • OAuth 동의 화면을 검토하고 앱 대시보드로 돌아갑니다.

  • 애플리케이션 대시보드의 자격 증명 탭에서 자격 생성>OAuth 클라이언트 ID를 선택합니다.

  • 애플리케이션 유형>웹 애플리케이션을 선택하고 이름을 선택합니다.

  • 권한 있는 리디렉션 URI 섹션에서 URI 추가를 선택하여 리디렉션 URI를 설정합니다. 예제 리디렉션 URI: https://localhost:{PORT}/signin-google, 여기서 {PORT} 자리 표시자는 앱의 포트입니다.

  • 만들기 단추를 선택합니다.

  • 앱의 구성에서 사용할 클라이언트 ID 및 클라이언트 암호를 저장합니다.

  • 사이트를 배포할 때 다음 중 하나를 수행합니다.

    • Google 콘솔에서 앱의 리디렉션 URI를 앱의 배포된 리디렉션 URI로 업데이트합니다.
    • 프로덕션 리디렉션 URI를 사용하여 프로덕션 앱에 대한 Google 콘솔에서 새 Google API 등록을 만듭니다.

Google 클라이언트 ID 및 암호 저장

비밀 관리자를 사용하여 Google 클라이언트 ID 및 암호 값과 같은 중요한 설정을 저장합니다. 이 샘플의 경우 다음 단계를 사용합니다.

  1. 비밀 스토리지 사용의 지침에 따라 비밀 스토리지에 대한 프로젝트를 초기화합니다.

  2. 비밀 키 Authentication:Google:ClientId 및 Authentication:Google:ClientSecret이 포함된 로컬 비밀 저장소에 중요한 설정을 저장합니다.

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

: 구분 기호는 모든 플랫폼의 환경 변수 계층적 키에서 작동하지 않습니다. 이중 밑줄 __은 다음과 같습니다.

  • 모든 플랫폼에서 지원됩니다. 예를 들어 : 구분 기호는 Bash에서 지원되지 않지만 __은 지원됩니다.
  • 자동으로 :으로 대체

API 콘솔에서 API 자격 증명과 사용 현황을 관리할 수 있습니다.

Google 인증 구성

앱에 Microsoft.AspNetCore.Authentication.Google NuGet 패키지를 추가합니다.

인증 서비스를 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"];
        });
}

인증 서비스를 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"];
    });

기본 구성표 설정을 구성하는 호출 AddIdentity 입니다. 오버로드는 AddAuthentication(IServiceCollection, String) 속성을 설정합니다 DefaultScheme . AddAuthentication(IServiceCollection, Action<AuthenticationOptions>) 오버로드를 통해 인증 옵션을 설정할 수 있으며, 이로서 다양한 용도를 위해 기본 인증 체계를 설정할 수 있습니다. 이전에 구성된 AuthenticationOptions 속성을 재정의하기 위한 AddAuthentication 후속 호출입니다.

AuthenticationBuilder 인증 처리기를 등록하는 확장 메서드는 인증 체계당 한 번만 호출할 수 있습니다. 구성표 속성, 구성표 이름 및 표시 이름을 구성할 수 있는 오버로드가 있습니다.

Google로 로그인

  • 앱을 실행하고 로그인을 선택합니다. Google로 로그인할 수 있는 옵션이 나타납니다.
  • Google 단추를 클릭합니다. 인증을 위해 Google로 리디렉션됩니다.
  • Google 자격 증명을 입력하면 웹 사이트로 다시 리디렉션됩니다.

프록시 또는 부하 분산 장치를 사용하여 요청 정보 전달

앱이 프록시 서버 또는 부하 분산 장치 뒤에 배포되는 경우 원래 요청 정보의 일부가 요청 헤더로 앱에 전달될 수 있습니다. 이 정보에는 일반적으로 보안 요청 체계(https), 호스트 및 클라이언트 IP 주소가 포함됩니다. 앱은 원래 요청 정보를 검색 및 사용하기 위해 이 요청 헤더를 자동으로 읽지 않습니다.

이 체계는 외부 공급자의 인증 흐름에 영향을 주는 링크 생성에 사용됩니다. 보안 체계(https)가 손실되면 앱이 잘못되고 안전하지 않은 리디렉션 URL을 생성합니다.

전달된 헤더 미들웨어를 사용하여 요청 처리를 위한 원본 요청 정보를 앱에 제공합니다.

자세한 내용은 프록시 서버 및 부하 분산 장치를 사용하도록 ASP.NET Core 구성을 참조하세요.

여러 인증 공급자

앱에서 여러 공급자가 필요한 경우, AddAuthentication 아래에서 공급자 확장 메서드를 연결합니다.

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

Google 인증에서 지원하는 구성 옵션에 대한 자세한 내용은 GoogleOptions API 참조를 확인하세요. 사용자에 대한 다른 정보를 요청하는 데 사용할 수 있습니다.

기본 콜백 URI 변경

URI 세그먼트 /signin-google은 Google 인증 공급자의 기본 콜백으로 설정됩니다. GoogleOptions 클래스의 상속된 RemoteAuthenticationOptions.CallbackPath 속성을 통해 Google 인증 미들웨어를 구성하는 동안 기본 콜백 URI를 변경할 수 있습니다.

문제 해결

  • 로그인이 작동하지 않고 오류가 발생하지 않는 경우 개발 모드로 전환하면 문제를 더 쉽게 디버깅할 수 있습니다.
  • ConfigureServices에서 services.AddIdentity를 호출하여 Identity를 구성하지 않은 경우 인증을 시도하면 ArgumentException: ‘SignInScheme’ 옵션을 제공해야 함이라고 표시됩니다. 본 자습서 내 프로젝트 템플릿으로서 Identity 설정을 보장할 수 있습니다.
  • 초기 마이그레이션을 적용하여 사이트 데이터베이스를 만들지 않은 경우 요청을 처리하는 동안 데이터베이스 작업이 실패했습니다 오류가 표시됩니다. 마이그레이션 적용을 선택하여 데이터베이스를 만들고 페이지를 새로 고쳐 오류를 무시하고 계속합니다.
  • Google과 같은 OAuth 2.0 공급자의 요청을 성공적으로 인증한 후 HTTP 500 오류가 발생했습니다. 이 GitHub 문제를 참조하세요.
  • React 및 기타 SPA 앱용 Google을 사용하여 외부 인증을 구현하는 방법: 이 GitHub 문제를 참조하세요.

다음 단계

  • 이 문서에서는 Google로 인증할 수 있는 방법을 살펴보았습니다. 비슷한 방식을 따라 이전 페이지에 나열된 다른 공급자로 인증할 수 있습니다.
  • Azure에 앱을 게시한 후에는 Google API 콘솔에서 ClientSecret을 다시 설정합니다.
  • Azure Portal에서 Authentication:Google:ClientId 및 Authentication:Google:ClientSecret을 애플리케이션 설정으로 설정합니다. 구성 시스템은 환경 변수에서 키를 읽도록 설정됩니다.