Google One Tap ログイン/サインアップ

プラグイン
,
1

|||
-|-|-|
:discourse: | 概要 | Discourse Google One Tap は、Discourse に Google One Tap のサインアップおよびサインインをサポートします。
:hammer_and_wrench: | リポジトリリンク | \u003chttps://github.com/discourse/discourse-google-one-tap\u003e
:open_book: | インストールガイド | Discourse にプラグインをインストールする方法


機能

このプラグインは、Discourse への Google One Tap サインインおよびサインアップをサポートします。このプラグインがインストールおよび設定されると、匿名ユーザーには次のようなプロンプトが表示されます。

image
image801×542 24.5 KB

そのプロンプトから、現在ログインしている Google アカウントを使用して、Discourse インスタンスにサインアップまたはログイン（同じメールアドレスでサイトにアカウントがある場合）できます。

設定

  1. google_one_tap_enabled 設定が有効になっていることを確認してください。

  2. Setup  |  Web guides  |  Google for Developers の指示に従って、クライアント ID を取得し、ログイン/サインアップ プロンプトと同意画面の外観を構成してください。

  3. ステップ 2 で取得したクライアント ID を google_oauth2_client_id サイト設定に追加します。

CHANGELOG

なし。

謝辞

このプラグインの初期バージョンを開発してくれた @ghassan に多大な感謝を。

「いいね！」 27
2

素晴らしいプラグインをありがとうございます。しかし、プラグインが不可視のdivを作成し、その下にある要素とのやり取りを不可能にするバグがあるようです。
また、モバイルではページ左側に余分なスペースができます。
モバイル:

image
image399×487 47.3 KB

デスクトップ:
image
image921×529 67.1 KB

「いいね！」 1
3

Discourse の組み込み Google ログインとはどのように異なりますか？

「いいね！」 1
4

こんにちは :wave: はい、このプラグインは確かにいくつか :heart: が必要です。昨日テストしたところ、同じ問題が発生しました。ログイン/サインアップモーダルにあるGoogle iframeにも問題があるようです。他のソーシャルボタンと同じ配置やスタイルではなく、ログインモーダルを開いてからサインアップに切り替えると、Googleボタンがレンダリングされません。

8

ドンさん、もう少し詳しい情報と、可能であればスクリーンショットを添えて、これを展開していただけますか？ローカルでは動作させることができました。

image
image1166×597 61.3 KB

しかし、シークレットモードでは同じ問題が発生します。

image
image1674×1476 350 KB

これには多くの理由が考えられます。例えば、Googleが追加した「指数関数的クールダウン」などです。

これが正しく読み込まれなかったことを検出する方法があるかもしれませんが、少なくともChromeでは、「Sign in to localhost with google.com」という要素はページ上に存在しません。これを使用できるかもしれません。

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

image
image1053×183 21.4 KB

11

このPRで問題が修正されるはずです。@Osama CSSスタイルをいくつか削除しました。お時間のある時に確認していただけますか？

Screenshot 2024-03-25 at 6.42.52 PM
Screenshot 2024-03-25 at 6.42.52 PM988×920 64.8 KB

Screenshot 2024-03-25 at 6.53.24 PM
Screenshot 2024-03-25 at 6.53.24 PM516×402 11.9 KB
Screenshot 2024-03-25 at 6.58.35 PM
Screenshot 2024-03-25 at 6.58.35 PM554×476 20.2 KB

「いいね！」 3
12

素晴らしいプラグインをありがとうございます。まさに探していたものです。
しかし、このプラグインは最新の変更である「ChromeのサードパーティCookie廃止は2024年第1四半期に開始」とも互換性がありますか？詳細はこちらのFedCMが必要となり、その移行についてをご覧ください。

もう一つの観察事項。

image
image725×409 38.2 KB

機能は非常に似ているので、Discourseが既に持っているネイティブのGoogleログインと組み合わせることは可能でしょうか？そうすれば、ログイン画面に2つの「Googleでログイン」ボックスが表示されなくなります。

image
image1090×368 49.7 KB

「いいね！」 1
13

@nathank さん、どなたも返信していないようですので、私が回答と、もしかしたら質問もさせていただきます。

これは、例えば以下のような、サイトにアクセスした際に一般的に表示されるGoogleアカウント作成プロンプトであると考えています。

IMG_0875
IMG_08751290×2796 248 KB

ネイティブのGoogle認証サポートとの主な違いは、ユーザーがログイン/サインアッププロンプトを見つけるのではなく、ページにアクセスしたときにこれがトリガーされることだと考えています。

「いいね！」 1
14

私の少し古い質問に答えていただき、本当に感謝しています!!

もしそれが（そしてそうであるように見えますが）それほど単純なのであれば、なぜこのプラグインの機能をコアに組み込まないのでしょうか??

「いいね！」 2
15

はい、同意します。または、コアでオプションにするのも良いでしょう。これは登録を増やし、オンボーディングの摩擦を減らすための非常に認識されている方法です。ユーザーはこのエクスペリエンスに慣れています。

「いいね！」 1
16

そのソリューションには、ログインを実際により困難にするいくつかの問題があり（またはありました）、モバイルでは見栄えが悪かったです。申し訳ありませんが、フィンランドでは大多数がGmailを使用しているにもかかわらず、無効にした理由やそれらの問題が何であったかをもう覚えていないため、これは本当に役に立たない回答です。

17

こちらも気づいたので、トピックを上げます。

18

その「通常の」Googleログインは使用しないでください。それほど難しくありません。どちらも保持しました。ワンタップはすべての状況でアクティブではないためです。

19

その通りですが、状況によっては、冗長なボタンを2つ持つか、まったく持たないかのどちらかを選択したくありません。:slight_smile:

20

初期ページの読み込み時にログイン/サインアップしようとするユーザーが、意図せずGoogleサーバーに連絡することになります。

21
  1. 管理者 → カスタマイズ → テーマ → CSS/HTMLに移動します。
  2. アクティブなテーマのCSSエディタを開きます。
  3. CSSセクションに次のコードを追加します。
div#google_one_tap.btn-social {
    display: none !important;
}
  1. 変更を保存します。
  2. ボタンが非表示になっていることを確認するためにページを更新します。
「いいね！」 2