arrow_back ASP.NET Core - Implement Google One Tap Sign In

comment Comments
Raymond Raymond access_time 3 months ago more_vert
#1859 Re: ASP.NET Core - Implement Google One Tap Sign In

Hi Rami, 

It's not easy to discuss about Identity framework in a comment as it covers many content. I suggest you following this article Introduction to Identity on ASP.NET Core | Microsoft Learn to understand the basics of Identity in ASP.NET Core.


format_quote

person Rami Taher access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

sorry for being a starter, how to access identity classes? I put your code and got lots of errors.

RT Rami Taher access_time 3 months ago more_vert
#1858 Re: ASP.NET Core - Implement Google One Tap Sign In

sorry for being a starter, how to access identity classes? I put your code and got lots of errors.

format_quote

person Raymond access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

With the information provided, you can use Identity classes to register the user if not exists or add the login to external logins table. In the article, I’ve provided some examples about how to implement this:


var user = new ApplicationUser { UserName = payload.Email, Email = payload.Email, FirstName = payload.GivenName, LastName = payload.FamilyName, IsEnabled = true, EmailConfirmed = true, DateRegister = DateTime.Now };
		await _userManager.CreateAsync(user).ConfigureAwait(false);
		// Add external Google login
		await _userManager.AddLoginAsync(user, new UserLoginInfo(provider, providerKey, provider)).ConfigureAwait(false);
		// Sign-in the user
        await _signInManager.SignInAsync(user, isPersistent: false).ConfigureAwait(false);

Raymond Raymond access_time 3 months ago more_vert
#1857 Re: ASP.NET Core - Implement Google One Tap Sign In

With the information provided, you can use Identity classes to register the user if not exists or add the login to external logins table. In the article, I’ve provided some examples about how to implement this:


var user = new ApplicationUser { UserName = payload.Email, Email = payload.Email, FirstName = payload.GivenName, LastName = payload.FamilyName, IsEnabled = true, EmailConfirmed = true, DateRegister = DateTime.Now };
		await _userManager.CreateAsync(user).ConfigureAwait(false);
		// Add external Google login
		await _userManager.AddLoginAsync(user, new UserLoginInfo(provider, providerKey, provider)).ConfigureAwait(false);
		// Sign-in the user
        await _signInManager.SignInAsync(user, isPersistent: false).ConfigureAwait(false);

format_quote

person Rami Taher access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

Thanks for the help and I finally got it working.


<div id="g_id_onload"

data-client_id="943211693904-bhh925h3rlbj7ml41rno455guds2uvqk.apps.googleusercontent.com"

data-context="signin" data-login_uri="https://localhost:44307/google-response" data-auto_select="false"

data-itp_support="false">

</div>


in google-response:


[Route("google-response")]

public async Task<ActionResult> GoogleResponse()

{

var google_csrf_name = "g_csrf_token";

var cookie = Request.Cookies[google_csrf_name];

if (cookie == null)

return StatusCode((int)HttpStatusCode.BadRequest);

var requestbody = Request.Form[google_csrf_name];

if (requestbody != cookie)

return StatusCode((int)HttpStatusCode.BadRequest);

var idtoken = Request.Form["credential"];

GoogleJsonWebSignature.Payload payload = await GoogleJsonWebSignature.ValidateAsync(idtoken).ConfigureAwait(false);

TempData["name"] = payload.Name;

TempData["email"] = payload.Email;

return Json(TempData);

}


Now, thought this will make me authenticated in my app but its not. Only getting info from google server. I want to be able to add the info to my users table in DB. Any ideas?

RT Rami Taher access_time 3 months ago more_vert
#1856 Re: ASP.NET Core - Implement Google One Tap Sign In

Thanks for the help and I finally got it working.


<div id="g_id_onload"

data-client_id="943211693904-bhh925h3rlbj7ml41rno455guds2uvqk.apps.googleusercontent.com"

data-context="signin" data-login_uri="https://localhost:44307/google-response" data-auto_select="false"

data-itp_support="false">

</div>


in google-response:


[Route("google-response")]

public async Task<ActionResult> GoogleResponse()

{

var google_csrf_name = "g_csrf_token";

var cookie = Request.Cookies[google_csrf_name];

if (cookie == null)

return StatusCode((int)HttpStatusCode.BadRequest);

var requestbody = Request.Form[google_csrf_name];

if (requestbody != cookie)

return StatusCode((int)HttpStatusCode.BadRequest);

var idtoken = Request.Form["credential"];

GoogleJsonWebSignature.Payload payload = await GoogleJsonWebSignature.ValidateAsync(idtoken).ConfigureAwait(false);

TempData["name"] = payload.Name;

TempData["email"] = payload.Email;

return Json(TempData);

}


Now, thought this will make me authenticated in my app but its not. Only getting info from google server. I want to be able to add the info to my users table in DB. Any ideas?

format_quote

person Raymond access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

If the client ID is correct (i.e. sign-in with Google works), there might be something wrong with Google GSI.

Please double check these two items:

  1. I assume your origin URL configured in Google Cloud is the same as your local website's URL?

  2. The rendered HTML has the correct client id. The element should look like the following:

    <div id="g_id_onload" data-client_id='***-****.apps.googleusercontent.com'
             data-login_uri='***'>


If there is nothing wrong with the above two, I'm afraid I won't be able to help much further. If you just registered the client app, I would suggest waiting for a little bit longer to try again (though I highly doubt that will be the cause).


You can try to contact Google for help or post it in Google forums. 

Raymond Raymond access_time 3 months ago more_vert
#1855 Re: ASP.NET Core - Implement Google One Tap Sign In

If the client ID is correct (i.e. sign-in with Google works), there might be something wrong with Google GSI.

Please double check these two items:

  1. I assume your origin URL configured in Google Cloud is the same as your local website's URL?

  2. The rendered HTML has the correct client id. The element should look like the following:

    <div id="g_id_onload" data-client_id='***-****.apps.googleusercontent.com'
             data-login_uri='***'>


If there is nothing wrong with the above two, I'm afraid I won't be able to help much further. If you just registered the client app, I would suggest waiting for a little bit longer to try again (though I highly doubt that will be the cause).


You can try to contact Google for help or post it in Google forums. 

format_quote

person Rami Taher access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

I pressed F12 and got this error:


Failed to load resource: the server responded with a status of 403 ()

[GSI_LOGGER]: The given client ID is not found.


but it is the same client ID i have.

RT Rami Taher access_time 3 months ago more_vert
#1854 Re: ASP.NET Core - Implement Google One Tap Sign In

I pressed F12 and got this error:


Failed to load resource: the server responded with a status of 403 ()

[GSI_LOGGER]: The given client ID is not found.


but it is the same client ID i have.

format_quote

person Raymond access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

Can you check if there are any JavaScript errors when using Developer Tools (F12) in your browser?

BTW, I assume you have included the following JavaScript within <head> tag?

  <script src="https://accounts.google.com/gsi/client" async defer></script>
Raymond Raymond access_time 3 months ago more_vert
#1853 Re: ASP.NET Core - Implement Google One Tap Sign In

Can you check if there are any JavaScript errors when using Developer Tools (F12) in your browser?

BTW, I assume you have included the following JavaScript within <head> tag?

  <script src="https://accounts.google.com/gsi/client" async defer></script>
format_quote

person Rami Taher access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

yes Iam using chrome and I am logged into my profile, might be the reason?

RT Rami Taher access_time 3 months ago more_vert
#1852 Re: ASP.NET Core - Implement Google One Tap Sign In

yes Iam using chrome and I am logged into my profile, might be the reason?

format_quote

person Raymond access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

Have you logged into a Google account in the same browser? I believe one tap only shows up of you have logged into the same browser or using a browser with google account signed in.

Raymond Raymond access_time 3 months ago more_vert
#1851 Re: ASP.NET Core - Implement Google One Tap Sign In

Have you logged into a Google account in the same browser? I believe one tap only shows up of you have logged into the same browser or using a browser with google account signed in.

format_quote

person Rami Taher access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

Yes I can login to google using the external login but I am interested to login using the one tap.2023091131509-Capture.PNG

but one tap is not showing

RT Rami Taher access_time 3 months ago more_vert
#1850 Re: ASP.NET Core - Implement Google One Tap Sign In

Yes I can login to google using the external login but I am interested to login using the one tap.2023091131509-Capture.PNG

but one tap is not showing

format_quote

person Raymond access_time 3 months ago
Re: ASP.NET Core - Implement Google One Tap Sign In

Did you register your local dev application in Google Cloud? data-client_id is the Client Id of the OAuth you registered.

Please log in or register to comment.

account_circle Log in person_add Register

Log in with external accounts