GoogleとのSNS連携
GoogleとのSNS連携についてご案内いたします。
Google側での設定
Googleクラウドのサイトにログインを行い、プロジェクトの作成を行います。
下のURLからログインを行ってください。
ログインを行うと下の画像のような画面が表示されます。
国・利用規約・電子メールの送信について確認を行い、[同意します]を選択します。
[プロジェクトを選択]→[新しい計画]を選択します。
プロジェクト名・位置を設定し、[保存]を選択します。
OAuth 同意画面の設定
[APIとサービス]→[OAuth 同意画面]を選択します。
OAuth 同意画面からUser Typeを外部に設定し[作成]を選択します。
[作成]を選択すると下の画像のような画面が表示されます。
以下の表のように設定を行ってください。
| タイトル | 設定 |
|---|---|
アプリ名 | 任意の物を設定 |
ユーザー サポートメール | 任意の物を設定 |
アプリのロゴ | 設定を行っても現在tripla側には共有されません。 ロゴの設定を行う場合はtripla管理画面から操作を行ってください。 |
アプリケーションのホームページ | ホームページのリンクを設定 |
[アプリケーション プライバシー ポリシー] リンク | プライバシー ポリシーのリンクを設定 |
[アプリケーション利用規約] リンク | 利用規約のリンクを設定 |
＋ドメインの追加 | サブドメインの利用の有無で設定が異なります。 サブドメインの利用がない場合：tripla.ai サブドメインの利用がある場合：ブランド ごとに設定を行っているサブドメイン（ブランド管理画面から[予約エンジン設定]→[サブドメイン設定]のページで確認する事が可能です。） |
デベロッパーの連絡先情報 | 管理を行うご担当者様のメールアドレス |
設定が完了したら[保存して次へ]を選択します。
スコープの設定画面が表示されます。
[スコープを追加または削除]を選択します。
フィルタの中から以下の3つのチェックボックスにチェックを入れます。
・Google アカウントのメインのメールアドレスの参照
・ユーザーの個人情報の表示（ユーザーが一般公開しているすべての個人情報を含む）
・Google で公開されているお客様の個人情報とお客様を関連付ける
設定が完了したら[保存して次へ]を選択します。
テストユーザーの設定画面が表示されます。
テストを行い、アプリの動作確認を行う場合はユーザーの追加を行ってください。
設定が完了したら[保存して次へ]を選択します。
概要が表示されます。
内容に間違いがない事を確認し、[ダッシュボードに戻る]を選択してください。
[ダッシュボードに戻る]を選択すると登録した詳細を確認する事が可能です。
認証情報の設定
認証情報の設定を行います。
画面左側のメニューから[認証情報]を選択します。
[＋認証情報を作成]→[OAuthクライアントID]を選択します。
アプリケーションの種類から[ウェブアプリケーション]を選択します。
OAuth クライアント ID の作成を行います。
以下の表のように設定を行ってください。
| タイトル | 設定 |
|---|---|
アプリケーションの種類 | ウェブアプリケーションを選択 |
名前 | 任意の名前を設定 |
承認済みの JavaScript 生成元 | 設定不要 |
承認済みのリダイレクト URI | iframeの場合：「https://bw.tripla.ai/sso/custom/callback」を設定してください。 サブドメインの場合：施設のサブドメインの後ろに「/sso/custom/callback」を付けて設定してください。 例：https://booking.tripla-hotel.com/sso/custom/callback |
設定が完了したら[保存]を選択します。
作成を行うとOAuth クライアント IDの一覧に作成した認証情報が表示されます。
選択すると詳細を確認する事が可能です。
クライアントID・クライアントシークレットを確認し、tripla管理画面に登録を行います。
tripla管理画面での設定
[設定]→[ウィジェット設定]を選択します。
[ログイン表示設定]を選択します。
シングルサインオン（SSO）設定のトグルスイッチをONにすると下の画像のような画面が表示されます。
[+SSOを追加する]から、カスタムを選択します。
カスタムを選択すると下の画像のような画面が表示されます。
以下の表のように設定を行ってください。
| tripla管理画面での表記 | 設定内容 |
|---|---|
タイトル | お客様画面に[タイトル]でログインと表示されます。 |
ドキュメントURLを検索 | 施設様で利用しているIdP URL |
レスポンスタイプ | code・id_tokenから選択してください。 |
クライアントID | Googleで作成したクライアントID |
シークレットトークン | Googleで作成したクライアント シークレット |
ロゴをアップロード | お客様画面に表示されるログインボタンの左端に表示されるロゴのアップロード ※OAuth 同意画面の設定でロゴの設定行っても反映されない為、こちらの画面から設定を行ってください。 |
ボタンの色 背景色 | お客様画面に表示されるログインボタンの背景色を選択する事が可能です。 |
ボタンの色 テキストカラー | お客様画面に表示されるログインボタンのテキストカラーを選択する事が可能です。 |
設定が完了すると会員登録画面に下の画像のように表示されます。
こちらでGoogleとのSNS連携は完了です。
権限 | 作業・閲覧可否 |
ブランド管理者 | 施設管理画面から作業・閲覧可 |
施設管理者 | 作業・閲覧可 |
施設運営者 | 作業・閲覧不可 |
最終更新
