Facebook、Google、ASP.NET Core での外部プロバイダーの認証Facebook, Google, and external provider authentication in ASP.NET Core

作成者: Valeriy NovytskyyRick AndersonBy Valeriy Novytskyy and Rick Anderson

このチュートリアルでは、ユーザーが OAuth 2.0 と外部の認証プロバイダーの資格情報を使用してサインインできる、ASP.NET Core アプリを構築する方法について説明します。This tutorial demonstrates how to build an ASP.NET Core app that enables users to sign in using OAuth 2.0 with credentials from external authentication providers.

以下のセクションでは、FacebookTwitterGoogle、および Microsoft の各プロバイダーを対象とします。また、この記事で作成するスタート プロジェクトを使用します。Facebook, Twitter, Google, and Microsoft providers are covered in the following sections and use the starter project created in this article. 他のプロバイダーは、AspNet.Security.OAuth.ProvidersAspNet.Security.OpenId.Providers などのサードパーティ パッケージで利用できます。Other providers are available in third-party packages such as AspNet.Security.OAuth.Providers and AspNet.Security.OpenId.Providers.

既存の資格情報でユーザーがサインインできるようになると:Enabling users to sign in with their existing credentials:

  • ユーザーにとって便利です。Is convenient for the users.
  • サインイン プロセスの複雑な管理の多くが、サード パーティに移ります。Shifts many of the complexities of managing the sign-in process onto a third party.

ソーシャル ログインによってトラフィックとユーザーの変換を促進する方法の例については、FacebookTwitter によるケース スタディを参照してください。For examples of how social logins can drive traffic and customer conversions, see case studies by Facebook and Twitter.

新しい .NET Core プロジェクトを作成するCreate a New ASP.NET Core Project

  • 新しいプロジェクトを作成します。Create a new project.
  • [ASP.NET Core Web アプリケーション][次へ] の順に選択します。Select ASP.NET Core Web Application and Next.
  • [プロジェクト名] を指定して、 [場所] を確認または変更します。Provide a Project name and confirm or change the Location. [作成] を選択します。Select Create.
  • ドロップダウン (ASP.NET Core {X.y} ) で ASP.NET Core の最新バージョンを選択し、 [Web アプリケーション] を選択します。Select the latest version of ASP.NET Core in the drop-down (ASP.NET Core {X.Y}), and then select Web Application.
  • [認証] の下で、 [変更] を選択して認証を [個人のユーザー アカウント] に設定します。Under Authentication, select Change and set the authentication to Individual User Accounts. [OK] を選択します。Select OK.
  • [新しい ASP.NET Core Web アプリケーションを作成する] ウィンドウで、 [作成] を選択します。In the Create a new ASP.NET Core Web Application window, select Create.

移行を適用するApply migrations

  • アプリを実行し、 [登録] リンクを選択します。Run the app and select the Register link.
  • 新しいアカウントの電子メール アドレスとパスワードを入力し、 [登録] を選択します。Enter the email and password for the new account, and then select Register.
  • 指示に従って移行を適用します。Follow the instructions to apply migrations.

プロキシまたはロード バランサーによる要求情報の転送Forward request information with a proxy or load balancer

アプリがプロキシ サーバーまたはロード バランサーの背後に展開されると、元の要求情報の一部が要求ヘッダー内でアプリに転送される場合があります。If the app is deployed behind a proxy server or load balancer, some of the original request information might be forwarded to the app in request headers. 通常、この情報にはセキュアな要求スキーム (https)、ホスト、およびクライアント IP アドレスが含まれます。This information usually includes the secure request scheme (https), host, and client IP address. アプリでは、これらの要求ヘッダーを自動的に読み取って、元の要求情報を検出して使用することはありません。Apps don't automatically read these request headers to discover and use the original request information.

スキームは、外部プロバイダーによる認証フローに影響を及ぼすリンクの生成に使用されます。The scheme is used in link generation that affects the authentication flow with external providers. セキュアなスキーム (https) が失われると、アプリでは、安全ではない不正なリダイレクト URL が生成されます。Losing the secure scheme (https) results in the app generating incorrect insecure redirect URLs.

Forwarded Headers Middleware を使用して、アプリが要求を処理する際に元の要求情報を利用できるようにします。Use Forwarded Headers Middleware to make the original request information available to the app for request processing.

詳細については、「プロキシ サーバーとロード バランサーを使用するために ASP.NET Core を構成する」を参照してください。For more information, see プロキシ サーバーとロード バランサーを使用するために ASP.NET Core を構成する.

SecretManager を使用して、ログイン プロバイダーから割り当てられたトークンを格納するUse SecretManager to store tokens assigned by login providers

ソーシャル ログイン プロバイダーは、登録プロセス中に アプリケーション ID トークンと アプリケーション シークレット トークンを割り当てます。Social login providers assign Application Id and Application Secret tokens during the registration process. 完全なトークン名はプロバイダーにより異なります。The exact token names vary by provider. これらのトークンは、アプリが API にアクセスするために使用する資格情報を示します。These tokens represent the credentials your app uses to access their API. トークンは、Secret Manager のヘルプにより、アプリの構成にリンクすることが可能な "ユーザー シークレット" になります。The tokens constitute the "user secrets" that can be linked to your app configuration with the help of Secret Manager. ユーザー シークレットは、 appsettings.json などの構成ファイルにトークンを格納することに代わるより安全な方法です。User secrets are a more secure alternative to storing the tokens in a configuration file, such as appsettings.json.

重要

Secret Manager は、開発目的のみのためのものです。Secret Manager is for development purposes only. Azure Key Vault 構成プロバイダーにより、Azure テストと運用のシークレットを格納し、保護することが可能です。You can store and protect Azure test and production secrets with the Azure Key Vault configuration provider.

Safe storage of app secrets in development in ASP.NET Core」(ASP.NET Core での開発中にアプリのシークレットを安全に格納する) トピックの手順に従い、以下の各ログイン プロバイダーから割り当てられたトークンを格納できるようにします。Follow the steps in Safe storage of app secrets in development in ASP.NET Core topic to store tokens assigned by each login provider below.

アプリケーションに必要なログイン プロバイダーをセットアップするSetup login providers required by your application

各プロバイダーを使用するようにアプリケーションを構成するには、以下のトピックを参照してください。Use the following topics to configure your application to use the respective providers:

複数の認証プロバイダーMultiple authentication providers

アプリが複数のプロバイダーを必要とする場合、AddAuthentication の背後にあるプロバイダーの拡張メソッドをチェインします。When the app requires multiple providers, chain the provider extension methods behind AddAuthentication:

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

必要に応じてパスワードを設定するOptionally set password

外部ログイン プロバイダーに登録するときに、アプリケーションにパスワードは登録していません。When you register with an external login provider, you don't have a password registered with the app. そのため、サイトのパスワードを作成し、記憶する作業は軽減されますが、外部ログイン プロバイダーに依存することにもなります。This alleviates you from creating and remembering a password for the site, but it also makes you dependent on the external login provider. 外部ログイン プロバイダーを使用できない場合、Web サイトにサインインすることができません。If the external login provider is unavailable, you won't be able to sign in to the web site.

外部プロバイダーでのサインイン プロセス中に設定した電子メール アドレスを使用して、パスワードを作成し、サインインするには、次の手順を実行します。To create a password and sign in using your email that you set during the sign in process with external providers:

  • 右上にある [Hello < 電子メール エイリアス>] リンクを選択して 管理 ビューに移動します。Select the Hello <email alias> link at the top-right corner to navigate to the Manage view.

Web アプリケーションの管理ビュー

  • [作成] を選択します。Select Create

パスワード ページを設定する

  • 有効なパスワードを設定します。そのパスワードと電子メール アドレスを使用してサインインできます。Set a valid password and you can use this to sign in with your email.

次の手順Next steps

  • ログイン ボタンをカスタマイズする方法については、こちらの GitHub イシューを参照してください。See this GitHub issue for information on how to customize the login buttons.
  • このキーの順に押します。では、外部認証プロバイダーを紹介し、外部ログインを ASP.NET Core アプリケーションに追加するために必要な前提条件について説明しました。This article introduced external authentication and explained the prerequisites required to add external logins to your ASP.NET Core app.
  • アプリケーションに必要なプロバイダーのログインを構成するには、各プロバイダーのページを参照してください。Reference provider-specific pages to configure logins for the providers required by your app.
  • ユーザーとそのアクセス トークン許可および更新トークンに関する追加のデータを保持することをお勧めします。You may want to persist additional data about the user and their access and refresh tokens. 詳細については、「ASP.NET Core で外部プロバイダーからの追加の要求とトークンを保持する」を参照してください。For more information, see ASP.NET Core で外部プロバイダーからの追加の要求とトークンを保持する.