Google One Tap Login/Signup

[Discourse]

	Summary	Discourse Google One Tap adds support for Google One Tap sign-up and sign-in to Discourse.
	Repository Link	https://github.com/discourse/discourse-google-one-tap
	Install Guide	How to install plugins in Discourse

Features

This plugin adds support for Google One Tap sign-in and sign-up to Discourse. When this plugin is installed and configured, anonymous users will see a prompt that looks like this:

From that prompt, they can use any Google account they’re currently logged-in to signup or login (if they already have an account on your site with the same email address) to your Discourse instance.

Configuration

1. Make sure the google_one_tap_enabled setting is enabled

2. Follow the instructions at Kurulum  |  Authentication  |  Google for Developers to get a client ID and configure what the login/signup prompt and consent screen look like

3. Add the client ID you got from step 2 to the google_oauth2_client_id site setting.

CHANGELOG

None.

Credits

Big thanks to @ghassan for developing the initial version of this plugin.

[aosus]

Thanks for the great plugin, however there seems to bug, where the plugin creates an invisible div, making it impossible to interact with any element below it.
It also creates extra space on the left side of the page on mobile.
Mobile:

Desktop:

[nathank (Nathan Kershaw)]

How does this differ from the inbuilt Google login for Discourse service?

Configure Google login for Discourse

Steps Go to https://console.developers.google.com, on the top left click on Select a project [image] On the top right, click on New Project [image] Fill in the Project Name field. You can also edit the Project ID (optional), then click on Create (This can take a while, so wait a minute as needed for it to appear.) [image] 3a. It is possible that errors are displayed after creating the project. Ignore them and refresh the page with Ctrl+F5 [image] Select your project by clic…

[Don]

Hello Yeah, this plugin definitely need some I tested it yesterday and experienced the same. It seems the google iframe on login/signup modal also has issues. It seems the alignment and styling isn’t the same as other social buttons and if I open the login modal than switch it to signup the google button isn’t render.

[martin (Martin Brennan)]

Hey Don can you please expand on this with a bit more information, and possibly some screenshots? I was able to get it working locally:

However in incognito mode I do experience the same issue:

There could be a lot of reasons for this; one for example is the “exponential cool down” Google added:

了解一键式用户体验  |  Authentication  |  Google for Developers

There may potentially be some way we can detect that this was not loaded correctly – but at least in chrome the element with “Sign in to localhost with google.com” is not even an element on the page. Maybe we can use this?

google.accounts.id.prompt((notification) => {
    console.log(notification)
});

[vinothkannans (Vinoth Kannan)]

UX: remove the invisible div and fix the mobile alignment.

This PR should fix the issue. @Osama I removed a few CSS styles. Can you please check it when you’re free?

[Petr_Mišák]

Thanks for a great plugin, it’s exactly what I was looking for.
But is the plugin also compatible with the latest changes “Chrome third-party cookie deprecation starts Q1 2024”. Here’s more information on the FedCM required and its migration.

Another observation.

The functionality is very similar, could it be combined with the native Google login that Discourse already has, so that the login screen doesn’t have two “Login with Google” boxes?

[Jacob_Peebles]

It looks like no one answered you @nathank so I will with what I believe is both the answer and maybe a question?

I think this one-tap is what is commonly seen as the Google account creation prompt when you hit a site, for example like this:

I believe the main difference between this and the native google auth support is this triggers when someone hits a page rather than a user finding their way to the login/signup prompt.

[nathank (Nathan Kershaw)]

I deeply appreciate you answering my slightly stale question!!

If it is that simple (and it seems it is), then why not roll this plugin’s functionality into core??

[Jacob_Peebles]

Yes agreed, or make it an option in core. This is a pretty well recognized way to increase registrations and lower onboarding friction - users are familiar with this experience.

[Jagster (Jakke Lehtonen)]

That solution has (or had) some issues that made login actually more difficult, and it looked messy on mobiles. Sorry, that is really useless answer, because I can’t remember any more what were those issues why I disabled it — even when majority is using Gmail here on Finland.

[sutterseba]

@Petr_Mišák

could it be combined with the native Google login that Discourse already has, so that the login screen doesn’t have two “Login with Google” boxes?

Bump, just noticed this as well.

[Jagster (Jakke Lehtonen)]

Not use that ”ordinary” Google login. It isn’t any harder. I kept both, because one tap isn’t active in every situations.

[sutterseba]

@Jagster

I kept both, because one tap isn’t active in every situations

Exactly, but I don’t want to choose between having two redundant buttons or none at all in some situations.

[discojan]

It will unwittingly contact google servers for anyone trying to login/signup on the initial page load.

[sasha_ilinsky (Aleksandr Ilinsky)]

1. Navigate to Admin → Customize → Themes → CSS/HTML.
2. Open the CSS editor for your active theme.
3. Add the following code to the CSS section:

div#google_one_tap.btn-social {
    display: none !important;
}

4. Save your changes.
5. Refresh the page to ensure the button is no longer visible.