Google ログインを連携する

自分のサービスの利用者が Google アカウントで登録できるようにするには、Google 側に自分のサービスを登録して、クライアント ID とクライアントシークレットを受け取る必要があります。

このページは、クライアント ID とクライアントシークレットを受け取る手順を案内します。受け取った二つの値を WEEGLOO に入れる方法はクライアント ID とクライアントシークレットを WEEGLOO に入れるに、同意画面にサービス名とロゴを表示する方法は同意画面にサービス名とロゴを表示するにあります。

Google でクライアント ID とクライアントシークレットを受け取る

以下の四つのステップは Google Cloud Console で進めます。Google アカウントでログインした状態である必要があります。ここで行う作業に費用はかかりません。

Google アカウントを複数使っている場合、リンクを押したときに意図しないアカウントで開くことがあります。画面右上のプロフィール写真を押してどのアカウントかを確認し、意図したアカウントでなければ切り替えてください。

プロジェクトを作る

すでに使っているプロジェクトがあれば、新しく作らずにそのプロジェクトをそのまま使ってもかまいません。その場合はこのステップを飛ばして、同意画面を構成するに進んでください。

新しいプロジェクトの画面(https://console.cloud.google.com/projectcreate (新しいタブで開きます))を開いてください。
プロジェクト名 に、あとで見分けられる名前を入力してください(例: ぬくもりクローゼット)。
作成を押してください。
コンソール上部のプロジェクト名が、いま作ったものになっているか確認してください。

OAuth クライアントを作る

ここで作るクライアントに、ログイン結果が戻ってくるアドレスを登録します。

Google Auth Platform の クライアント 画面(https://console.cloud.google.com/auth/clients (新しいタブで開きます))を開いてください。
クライアントを作成 を押してください。
アプリケーションの種類 で ウェブアプリケーション を選んでください。
名前に、このクライアントを見分けられる名前を入力してください(例: ぬくもりクローゼット)。
承認済みの JavaScript 生成元 は空のままにしておいてください。
承認済みのリダイレクト URI の URI を追加 を押してください。
表示された欄に、下のアドレスを貼り付けてください。自分の Space を選ぶと識別子が埋まります。

Space
https://auth.weegloo.com/v1/spaces/{spaceId}/login/oauth2/code/google

自分の Space がどれか分からず、AI エージェントに連携を任せている場合は、エージェントに尋ねる方法もあります。チャットで「Google ログインに登録するリダイレクトアドレスを教えて」とリクエストすると、完成したアドレスを受け取れます。
作成を押してください。

一覧には Android や iOS のような種類もありますが、モバイルアプリにログインを組み込む場合でも ウェブアプリケーション を選びます。ログイン結果が戻る先が自分のアプリではなく、WEEGLOO のウェブアドレスだからです。名前は Google の画面でクライアントを区別するためのもので、利用者には表示されません。

登録したアドレスはすぐに反映されないことがあります

フォームの下には「注: 設定が有効になるまで 5 分から数時間かかることがあります」という Google の案内があります。登録した直後はまだ反映されておらず、ログインが通らないことがあります。そのときは時間を置いてから試してください。

クライアント ID とクライアントシークレットをコピーする

作成を押すと OAuth クライアントを作成しました という画面が表示されます。ここに書かれているクライアント ID とクライアントシークレットを WEEGLOO に入れます。

画面を閉じるとクライアントシークレットを二度と表示できません

この画面には「このダイアログを閉じると、クライアントシークレットを表示およびダウンロードできなくなります」という警告があります。画面を閉じる前に、クライアント ID とクライアントシークレットをコピーしておいてください。値をファイルとして受け取りたい場合は、JSON をダウンロード を押してもかまいません。

クライアント ID の右にあるコピーアイコンを押して、値をコピーしておいてください。
クライアントシークレット の右にあるコピーアイコンを押して、値をコピーしておいてください。
クライアント ID とクライアントシークレットをどちらも控えたら、OK を押してください。

クライアント ID とクライアントシークレットがコンテンツスタジオのどの欄に入るかは、次のとおりです。

Google の画面	コンテンツスタジオ
クライアント ID	Client ID
クライアントシークレット	Client Secret

クライアントシークレットは名前のとおり秘密の値です。他の人に教えたり、公開された場所に書き残したりしないでください。

クライアント ID とクライアントシークレットを WEEGLOO に入れる

これでクライアント ID とクライアントシークレットが手元にあります。ここから先は、これまでどのように作業してきたかによって分かれます。

コンテンツスタジオで直接設定していた場合は、次のように進めてください。

サービス会員ログインのソーシャルログインを有効にする手順に戻ってください。
Google を有効にしてください。
Step 2 の Client ID の欄にクライアント ID を入力してください。
Client Secret の欄にクライアントシークレットを入力してください。
保存を押してください。

AI エージェントに連携を任せていて、クライアント ID とクライアントシークレットを受け取ってくるように案内された場合は、受け取った二つの値をそのままチャットに貼り付けて、作業を続けてください。残りの設定はエージェントが引き続き処理します。

同意画面にサービス名とロゴを表示する

利用者が Google アカウントでログインするときに表示される同意画面には、最初は自分のサービス名ではなく WEEGLOO のドメインが表示されます。利用者はどのサービスに登録するのかが分かりにくく、似せて作られた偽サイトと見分けることも難しくなります。自分のサービス名とロゴが表示されれば、利用者は安心して登録できます。

ログインはこの状態でも動作するため、必須ではありません。サービスを実際に公開する前に済ませておくことをおすすめします。名前とロゴは、Google のブランディング認証 (新しいタブで開きます)を受けると表示されます。

ホームページとプライバシーポリシーを用意する

Google は、同意画面に表示する名前が実際のサービスの名前かどうかをホームページで確認します。自分のサイトにホームページとプライバシーポリシーを用意してください。

AI エージェントに連携を任せている場合は、「Google のブランディング認証に必要なホームページとプライバシーポリシーを作って」とリクエストしてください。

ホームページ: ログインなしで開けて、サービスを説明し、プライバシーポリシーへリンクするページ。ログインボタンは別のページに置きます。
プライバシーポリシー: ホームページと同じアドレスの下で、Google アカウントから受け取った情報をどのように使い、保管するかを明らかにするページ。

利用規約は任意です。

Search Console でサイトの確認を受ける

ホームページが自分のものであることは、Google Search Console で証明します。

AI エージェントに連携を任せている場合は、下の 5 番で受け取ったファイルをチャットにアップロードして、「このファイルをサイトに入れて再公開して」とリクエストしてください。6 番はエージェントが処理します。

Search Console(https://search.google.com/search-console (新しいタブで開きます))を開いてください。Google Cloud プロジェクトのオーナーまたは編集者であるアカウントである必要があります。
ウェブサイトを追加 を押してください。すでに登録したサイトがある場合は、左上のプロパティ選択メニューで プロパティを追加 を押してから ウェブサイトを追加 を押してください。
プロパティタイプの選択 の画面で、URL プレフィックス の欄にホームページのアドレスを入力してください(例: https://nukumori-closet.weegloo.app/)。
URL プレフィックス 側の続行を押してください。
所有権の確認 の画面の HTML ファイル で、ファイル名が書かれたボタンを押してファイルをダウンロードしてください。この画面は閉じずに開いたままにしておいてください。
受け取ったファイルを名前そのままでサイトの一番上のフォルダに入れて、もう一度公開してください(サイトを直してから再公開する)。
所有権の確認 の画面に戻って確認を押してください。

所有権を確認しました と表示されれば、このステップは完了です。

確認ファイルは削除しないでください

Search Console は、このファイルが残っているかを定期的に確認し直します。サイトをもう一度アップロードするときも一緒に入れてください。

ブランディング情報を入力する

用意したページと、表示する名前、ロゴを Google に知らせます。

Google Auth Platform の ブランディング 画面(https://console.cloud.google.com/auth/branding (新しいタブで開きます))を開いてください。
アプリ名 に、ホームページに書いたサービス名をそのまま入力してください。Google 製品の名前は入れられません。
アプリのロゴ に、自分のサービス固有のロゴをアップロードしてください。他のブランドのロゴを使うと認証されません。ファイルは 1MB 以下の JPG、PNG、BMP で、120×120px の正方形が最もきれいに表示されます。
アプリケーションのホームページ と アプリケーションのプライバシーポリシーのリンク に、ホームページとプライバシーポリシーのアドレスを入れてください。利用規約があれば アプリケーションの利用規約のリンク にも入れます。
承認済みドメイン に weegloo.app を入れてください。
- 項目がなければ ドメインの追加 を押して入力します。
- 既存の項目があれば、その欄の値を weegloo.app に直します。既存の項目は削除できないことがあります。そのような場合は値を直せば済みます。
保存を押してください。

認証をリクエストして公開する

ブランディング認証は、アプリを公開したあとにリクエストできます。テスト状態では認証ボタンが表示されません。

対象の画面で アプリを公開 を押してください。
本番環境に push しますか? の画面で確認を押してください。
ブランディング 画面の 確認ステータス で ブランディングを確認 を押してください。認証には最大 5 分ほどかかります。
補うべき点があれば 問題を表示 で内容を確認してください。直したあとに 問題を修正しました を選んで、もう一度リクエストします。
通過したら 7 日以内に ブランディングを公開 を押してください。

公開すると、同意画面に自分のサービス名とロゴが表示されます。

次にやること

サービス会員ログイン: 受け取った値をコンテンツスタジオに入力し、会員ログインの残りの設定を終えます。
メンバーのロールと権限: 登録した会員が何を見て使えるかを定める ServiceUserRole を作ります。
Auth API: ログインを自分のサイトのコードに組み込むときに必要となる、リクエスト形式などの技術仕様を扱います。

Google でクライアント ID とクライアント シークレットを受け取る