arrow_back ASP.NET Core - Implement Google One Tap Sign In
person Rami Taher access_time 8 months ago
sorry for being a starter, how to access identity classes? I put your code and got lots of errors.
sorry for being a starter, how to access identity classes? I put your code and got lots of errors.
person Raymond access_time 8 months ago
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);
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);
person Rami Taher access_time 8 months ago
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?
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?
person Raymond access_time 8 months ago
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:
I assume your origin URL configured in Google Cloud is the same as your local website's URL?
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.
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:
I assume your origin URL configured in Google Cloud is the same as your local website's URL?
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.
person Rami Taher access_time 8 months ago
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.
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.
person Raymond access_time 8 months ago
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>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>person Rami Taher access_time 8 months ago
yes Iam using chrome and I am logged into my profile, might be the reason?
yes Iam using chrome and I am logged into my profile, might be the reason?
person Raymond access_time 8 months ago
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.
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.
person Rami Taher access_time 8 months ago
Yes I can login to google using the external login but I am interested to login using the one tap.
but one tap is not showing
Yes I can login to google using the external login but I am interested to login using the one tap.
but one tap is not showing
person Raymond access_time 8 months ago
Did you register your local dev application in Google Cloud? data-client_id is the Client Id of the OAuth you registered.
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.