Skip to content

Commit 4b60f28

Browse files
timdeschryvertimdeschryver
authored
update google logins (#35545)
1 parent 1e29549 commit 4b60f28

File tree

2 files changed

+86
-53
lines changed

2 files changed

+86
-53
lines changed

‎aspnetcore/security/authentication/social/google-logins.md

Lines changed: 80 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -4,85 +4,116 @@ author: rick-anderson
44
description: This tutorial demonstrates the integration of Google account user authentication into an existing ASP.NET Core app.
55
ms.author: riande
66
ms.custom: mvc
7-
ms.date: 3/3/2022
7+
ms.date: 06/18/2025
88
uid: security/authentication/google-logins
99
---
1010
# Google external login setup in ASP.NET Core
1111

12-
By [Valeriy Novytskyy](https://github.com/01binary), [Rick Anderson](https://twitter.com/RickAndMSFT) and [Sharaf Abacery](https://github.com/sharafabacery)
12+
By [Valeriy Novytskyy](https://github.com/01binary), [Rick Anderson](https://twitter.com/RickAndMSFT), and [Sharaf Abacery](https://github.com/sharafabacery)
1313

14-
This tutorial shows you how to enable users to sign in with their Google account using the ASP.NET Core project created on the [previous page](xref:security/authentication/social/index).
14+
This tutorial shows how to enable user sign in with Google accounts using a sample ASP.NET Core project created in <xref:security/authentication/social/index>. Follow Google's official guidance in [Sign in with Google for Web: Setup](https://developers.google.com/identity/gsi/web/guides/get-google-api-clientid) to create a Google API client ID.
1515

16-
## Create the Google OAuth 2.0 Client ID and secret
16+
## Create the app in Google
1717

18-
* Follow the guidance in [Integrating Google Sign-In into your web app](https://developers.google.com/identity/gsi/web/guides/overview) (Google documentation)
19-
* Go to [Google API & Services](https://console.cloud.google.com/apis).
20-
* A **Project** must exist first, you may have to create one. Once a project is selected, enter the **Dashboard**.
18+
* Navigate to the [Google API & Services](https://console.cloud.google.com/apis) page of the Google Cloud platform.
19+
* If no project exists, create a new project by selecting the **Create Project** button. To select a different project than an existing project that loads, select the loaded project's button in the top-left corner of the UI, followed by the project. To add a new project, select the loaded project's button in the top-left corner of the UI, followed by the **New project** button.
20+
* When creating a new project:
21+
* Enter a **Project name**.
22+
* Optionally, select an **Organization** for the project.
23+
* Select the **Create** button.
2124

22-
* In the **OAuth consent screen** of the **Dashboard**:
23-
* Select **User Type - External** and **CREATE**.
24-
* In the **App information** dialog, Provide an **app name** for the app, **user support email**, and **developer contact information**.
25-
* Step through the **Scopes** step.
26-
* Step through the **Test users** step.
27-
* Review the **OAuth consent screen** and go back to the app **Dashboard**.
25+
After creating the project, the **Dashboard** page of the project loads, where it's possible to configure the project.
2826

29-
* In the **Credentials** tab of the application Dashboard, select **CREATE CREDENTIALS** > **OAuth client ID**.
30-
* Select **Application type** > **Web application**, choose a **name**.
31-
* In the **Authorized redirect URIs** section, select **ADD URI** to set the redirect URI. Example redirect URI: `https://localhost:{PORT}/signin-google`, where the `{PORT}` placeholder is the app's port.
32-
* Select the **CREATE** button.
33-
* Save the **Client ID** and **Client Secret** for use in the app's configuration.
34-
* When deploying the site, either:
35-
* Update the app's redirect URI in the **Google Console** to the app's deployed redirect URI.
36-
* Create a new Google API registration in the **Google Console** for the production app with its production redirect URI.
27+
Open the **Credentials** tab to create the OAuth client.
28+
29+
The prerequisite to creating the credentials is to configure the OAuth consent screen. If the consent isn't configured, there's a prompt to configure the consent screen.
30+
31+
* Select **Configure consent screen** or select **OAuth consent screen** in the sidebar.
32+
* In the **OAuth consent screen**, select **Get started**.
33+
* Set the **App name** and **User support email**.
34+
* Set the audience type to **External**.
35+
* Add **Contact information** by entering a contact email address.
36+
* Agree to the terms.
37+
* Select **Create**.
38+
39+
Create the client credentials for the app by opening the **Clients** sidebar menu item:
40+
41+
* Select the **Create client** button.
42+
* Select **Web application** as the **Application type**.
43+
* Enter a **Name** for the client.
44+
* Add an **Authorized redirect URI**. For local testing, use the default address `https://localhost:{PORT}/signin-google`, where the `{PORT}` placeholder is the app's port.
45+
* Select the **Create** button to create the client.
46+
* Save the **Client ID** and **Client secret**, which are used later in the ASP.NET app configuration.
47+
48+
> [!NOTE]
49+
> The URI segment `/signin-google` is set as the default callback of the Google authentication provider. It's possible to change the default callback URI while configuring the Google authentication middleware via the inherited <xref:Microsoft.AspNetCore.Authentication.RemoteAuthenticationOptions.CallbackPath%2A?displayProperty=nameWithType> property of the <xref:Microsoft.AspNetCore.Authentication.Google.GoogleOptions> class.
50+
51+
When deploying the app, either:
52+
53+
* Update the app's redirect URI in the **Google Console** to the app's deployed redirect URI.
54+
* Create a new Google API registration in the **Google Console** for the production app with its production redirect URI.
3755

3856
## Store the Google client ID and secret
3957

40-
Store sensitive settings such as the Google client ID and secret values with [Secret Manager](xref:security/app-secrets). For this sample, use the following steps:
58+
Store sensitive settings, such as the Google client ID and secret values, with [Secret Manager](xref:security/app-secrets). For this sample, follow these steps:
4159

42-
1. Initialize the project for secret storage per the instructions at [Enable secret storage](xref:security/app-secrets#enable-secret-storage).
43-
1. Store the sensitive settings in the local secret store with the secret keys `Authentication:Google:ClientId` and `Authentication:Google:ClientSecret`:
60+
1. Initialize the project for secret storage according to the instructions in <xref:security/app-secrets>.
61+
1. Store the sensitive settings in the local secret store with the secret keys `Authentication:Google:ClientId` (value: `{CLIENT ID}` placeholder) and `Authentication:Google:ClientSecret` (value: `{CLIENT SECRET}` placeholder):
4462

4563
```dotnetcli
46-
dotnet user-secrets set "Authentication:Google:ClientId" "<client-id>"
47-
dotnet user-secrets set "Authentication:Google:ClientSecret" "<client-secret>"
64+
dotnet user-secrets set "Authentication:Google:ClientId" "{CLIENT ID}"
65+
dotnet user-secrets set "Authentication:Google:ClientSecret" "{CLIENT SECRET}"
4866
```
4967
5068
[!INCLUDE[](~/includes/environmentVarableColon.md)]
5169
52-
You can manage your API credentials and usage in the [API Console](https://console.developers.google.com/apis/dashboard).
70+
Manage API credentials and usage in the [API Console](https://console.developers.google.com/apis/dashboard).
5371
5472
## Configure Google authentication
5573
56-
* Add the [`Google.Apis.Auth.AspNetCore3`](https://www.nuget.org/packages/Google.Apis.Auth.AspNetCore3) NuGet package to the app.
57-
* Add the Authentication service to the `program.cs`:
58-
* Follow [`Add Authentication for asp.net app`](https://developers.google.com/api-client-library/dotnet/guide/aaa_oauth#configure-your-application-to-use-google.apis.auth.aspnetcore3)
74+
:::moniker range=">= aspnetcore-6.0"
5975
60-
[!INCLUDE [default settings configuration](includes/default-settings2-2.md)]
76+
Add the authentication service to the `Program` file:
6177
62-
## Sign in with Google
63-
* Get a link to the library at [Google Developer Library](https://developers.google.com/identity/gsi/web/guides/client-library).
64-
* Then go to [Google Developer Button Generation](https://developers.google.com/identity/gsi/web/tools/configurator).
65-
* Setup your Controller to match the `data-login_uri="{HostName}/{ControllerName}/{actionName}"` attribute, as it will forward you to that link after a successful login.
66-
* Create a controller and action that takes one argument `string credential`, which is returned by Google upon completing the login process.
67-
* Verify the `credential` using the following line of code:
68-
`GoogleJsonWebSignature.Payload payload = await GoogleJsonWebSignature.ValidateAsync(credential);`
69-
* This will retrieve the available information about the logged-in user, which could then be stored in a database.
78+
:::code language="csharp" source="~/security/authentication/social/social-code/6.x/ProgramGoogle.cs" id="snippet1":::
7079
80+
:::moniker-end
81+
82+
:::moniker range="< aspnetcore-6.0"
83+
84+
Add the authentication service to `Startup.ConfigureServices`:
85+
86+
```csharp
87+
services.AddAuthentication().AddGoogle(googleOptions =>
88+
{
89+
googleOptions.ClientId = configuration["Authentication:Google:ClientId"];
90+
googleOptions.ClientSecret = configuration["Authentication:Google:ClientSecret"];
91+
});
92+
```
93+
94+
:::moniker-end
95+
96+
[!INCLUDE [default settings configuration](includes/default-settings.md)]
97+
98+
## Sign in with Google
7199

72-
## Change the default callback URI
100+
* Run the app and select **Log in**.
101+
* Under **Use another service to log in.**, select Google.
102+
* The browser is redirected to **Google** for authentication.
103+
* Select the Google account to log in or enter Google credentials.
104+
* If this is the first time signing in, there's a prompt to allow the app to access the Google account information.
105+
* The browser is redirected back to the app, where it's possible to set the email.
73106

74-
The URI segment `/signin-google` is set as the default callback of the Google authentication provider. You can change the default callback URI while configuring the Google authentication middleware via the inherited <xref:Microsoft.AspNetCore.Authentication.RemoteAuthenticationOptions.CallbackPath?displayProperty=nameWithType> property of the <xref:Microsoft.AspNetCore.Authentication.Google.GoogleOptions> class.
107+
The user is now logged in using Google credentials.
75108

76109
## Troubleshooting
77110

78-
* If the sign-in doesn't work and you aren't getting any errors, switch to development mode to make the issue easier to debug.
79-
* If Identity isn't configured by calling `services.AddIdentity` in `ConfigureServices`, attempting to authenticate results in *ArgumentException: The 'SignInScheme' option must be provided*. The project template used in this tutorial ensures Identity is configured.
80-
* If the site database has not been created by applying the initial migration, you get *A database operation failed while processing the request* error. Select **Apply Migrations** to create the database, and refresh the page to continue past the error.
81-
* HTTP 500 error after successfully authenticating the request by the OAuth 2.0 provider such as Google: See [this GitHub issue](https://github.com/dotnet/AspNetCore.Docs/issues/14169).
82-
* How to implement external authentication with Google for React and other SPA apps: See [this GitHub issue](https://github.com/dotnet/AspNetCore.Docs/issues/14169).
111+
* If the sign-in doesn't work without receiving any errors, switch to development mode to make the app and Google registration easier to debug.
112+
* If the site's database hasn't been created by applying the initial migration, the following error occurs: *A database operation failed while processing the request*. Select **Apply Migrations** to create the database and refresh the page to continue past the error.
113+
* For information about an HTTP 500 error after successfully authenticating the request by the OAuth 2.0 provider, such as Google, and information on how to implement external authentication with Google for React and other SPA apps, see [Middleware not handling 'signin-google' route after successful authentication in Asp.Net Core Web Api External Login Authentication (`dotnet/AspNetCore.Docs` #14169)](https://github.com/dotnet/AspNetCore.Docs/issues/14169).
83114

84115
## Next steps
85116

86-
* This article showed how you can authenticate with Google. You can follow a similar approach to authenticate with other providers listed on the [previous page](xref:security/authentication/social/index).
87-
* Once you publish the app to Azure, reset the `ClientSecret` in the Google API Console.
88-
* Set the `Authentication:Google:ClientId` and `Authentication:Google:ClientSecret` as application settings in the Azure portal. The configuration system is set up to read keys from environment variables.
117+
* This article demonstrates authentication with Google. For information on authenticating with other external providers, see <xref:security/authentication/social/index>.
118+
* After the app is deployed to Azure, reset the `ClientSecret` in the Google API console.
119+
* Set the `Authentication:Google:ClientId` and `Authentication:Google:ClientSecret` as app settings in the Azure portal. The configuration system is set up to read keys from the environment variables.

‎aspnetcore/security/authentication/social/social-code/6.x/ProgramGoogle.cs

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@
22
var services = builder.Services;
33
var configuration = builder.Configuration;
44

5+
// <snippet1>
56
services.AddAuthentication().AddGoogle(googleOptions =>
6-
{
7-
googleOptions.ClientId = configuration["Authentication:Google:ClientId"];
8-
googleOptions.ClientSecret = configuration["Authentication:Google:ClientSecret"];
9-
});
7+
{
8+
googleOptions.ClientId = configuration["Authentication:Google:ClientId"];
9+
googleOptions.ClientSecret = configuration["Authentication:Google:ClientSecret"];
10+
});
11+
// </snippet1>

0 commit comments

Comments
 (0)