Google One Tap Login/Signup

[Osama]

	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 設定  |  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?