メインコンテンツへスキップ

WisdomBaseでSNS認証を追加する手順

  • 更新

WisdomBaseでは、Google、Facebook、LINEのアカウントを利用して、エンドユーザーがログイン・会員登録できるソーシャルログイン機能を提供しています。 本記事では、各サービスで認証情報を取得し、WisdomBaseで利用を開始するまでの手順をご案内します。

ソーシャルログインの利用には、WisdomBase側の設定が必要です。設定を始める前に、弊社担当者までご連絡ください。

目次

[1] Googleログインを設定する

Googleログインを利用すると、エンドユーザーはGoogleアカウントを使ってWisdomBaseにログイン・会員登録できます。 WisdomBase用のIDやパスワードを新たに管理する必要がなく、Googleアカウントに登録されているメールアドレスを利用できます。

事前準備

  • Google Cloudプロジェクトを作成・編集できるGoogleアカウントをご用意ください
  • WisdomBaseで実際に使用するドメインを確定してください
  • 組織内ユーザーのみに利用を限定するか、組織外のGoogleアカウントにも公開するかを決めてください

組織内ユーザーのみに利用を限定する設定は、Google WorkspaceまたはCloud Identityの組織に属するGoogle Cloudプロジェクトで利用します。 必要な権限が不明な場合は、貴社のGoogle Workspace管理者へご確認ください。

Google OAuthクライアントを作成する

  1. Google Cloud Consoleにログインします。
  2. 画面上部のプロジェクト選択メニューから、今回の設定に使用するプロジェクトを選択します。 適切なプロジェクトがない場合は、「WisdomBase Googleログイン」など、用途が分かる名前で新しいプロジェクトを作成します。
  3. Google Auth Platformの設定画面を開き、アプリの情報を登録します。
    • アプリ名
    • ユーザーサポート用メールアドレス
    • デベロッパーの連絡先
    • 必要に応じて、ホームページやプライバシーポリシーのURL
  4. 利用対象を設定します。
    • 組織内のみ：Google WorkspaceまたはCloud Identityの組織内ユーザーだけが利用する場合に選択します
    • 外部：Gmailなど、組織外のGoogleアカウントも利用する場合に選択します
  5. 外部向けアプリをテスト状態で利用する場合は、テストに使用するGoogleアカウントをテストユーザーとして登録します。 本番利用前には、画面の案内に従って公開状態を確認してください。
  6. 「Clients」画面で「Create client」をクリックし、アプリケーションの種類として「Web application」を選択します。
  7. クライアント名を入力します。例：「WisdomBase Google Login」
  8. 「Authorized redirect URIs」に、以下のURLを登録します。

多言語機能を利用していない場合は、以下の2つを登録してください。

  • https://[WisdomBaseのドメイン]/users/auth/google/callback
  • https://[WisdomBaseのドメイン]/ja/users/auth/google/callback

多言語機能を利用している場合は、使用する言語に応じて以下も登録してください。

  • https://[WisdomBaseのドメイン]/en/users/auth/google/callback
  • https://[WisdomBaseのドメイン]/ko/users/auth/google/callback
  • https://[WisdomBaseのドメイン]/vi/users/auth/google/callback
  • https://[WisdomBaseのドメイン]/pt-br/users/auth/google/callback
  • https://[WisdomBaseのドメイン]/zh-cn/users/auth/google/callback
  • https://[WisdomBaseのドメイン]/zh-tw/users/auth/google/callback

リダイレクトURIは、文字の大小、末尾のスラッシュの有無を含めて完全に一致している必要があります。 [WisdomBaseのドメイン]は、実際に使用するドメイン（例：example.wisdombase.com）へ置き換えてください。

  1. 「Create」をクリックします。
  2. 作成されたクライアントIDとクライアントシークレットを確認します。
  3. 弊社担当者がご案内する安全な方法で、クライアントIDとクライアントシークレットを共有してください。

クライアントシークレットは重要な秘密情報です。メール本文やチャットへ直接記載せず、弊社担当者が指定する方法で共有してください。

ドメインを変更すると、登録済みのリダイレクトURIも変更する必要があります。 ドメイン変更を予定している場合は、変更完了後にOAuthクライアントを設定してください。

Google Cloud Consoleの画面名や配置は変更される場合があります。最新の操作方法は、 Googleの公式ドキュメントもあわせてご確認ください。

[2] Facebookログインを設定する

Facebookログインを利用すると、エンドユーザーはFacebookアカウントを使ってWisdomBaseにログイン・会員登録できます。 WisdomBase用のIDやパスワードを新たに管理する必要がありません。

Facebookアカウントの状態やユーザーの許可状況によっては、メールアドレスを取得できない場合があります。 本番公開前に、実際の登録・ログイン動作をご確認ください。

事前準備

  • Meta for Developersを利用できるFacebookアカウントをご用意ください
  • WisdomBaseで実際に使用するドメインを確定してください
  • プライバシーポリシー、利用規約、ユーザーデータ削除に関する案内など、Metaの設定画面で求められるページのURLをご用意ください

Facebookログインを設定する

  1. Meta for Developersにログインします。
  2. 新しいアプリを作成し、ユーザー認証・アカウント作成に対応するユースケースを選択します。 表示されるユースケース名は、Metaの画面更新により異なる場合があります。
  3. アプリの基本設定を開き、アプリ名、連絡先、アプリドメイン、プライバシーポリシーURLなどの必須項目を入力します。
  4. Facebookログインの設定画面を開き、「Valid OAuth Redirect URIs」にリダイレクトURIを登録します。

多言語機能を利用していない場合は、以下の2つを登録してください。

  • https://[WisdomBaseのドメイン]/users/auth/facebook/callback
  • https://[WisdomBaseのドメイン]/ja/users/auth/facebook/callback

多言語機能を利用している場合は、使用する言語に応じて以下も登録してください。

  • https://[WisdomBaseのドメイン]/en/users/auth/facebook/callback
  • https://[WisdomBaseのドメイン]/ko/users/auth/facebook/callback
  • https://[WisdomBaseのドメイン]/vi/users/auth/facebook/callback
  • https://[WisdomBaseのドメイン]/pt-br/users/auth/facebook/callback
  • https://[WisdomBaseのドメイン]/zh-cn/users/auth/facebook/callback
  • https://[WisdomBaseのドメイン]/zh-tw/users/auth/facebook/callback
  1. 「Permissions and Features」または同等の設定画面で、public_profileとemailの利用状態を確認します。 一般のエンドユーザーが利用できる状態にするため、画面に表示される案内に従って、必要なアクセスレベルの設定、ビジネス認証、アプリレビューなどを完了してください。
  2. 必須項目に未入力がないことを確認し、アプリを本番利用できる状態にします。
  3. App IDとApp Secretを確認します。
  4. 弊社担当者がご案内する安全な方法で、App IDとApp Secretを共有してください。

App Secretは重要な秘密情報です。メール本文やチャットへ直接記載せず、弊社担当者が指定する方法で共有してください。

Meta for Developersの画面名や、本番公開に必要な確認・審査の条件は変更される場合があります。 設定画面に表示される最新の案内をご確認ください。

[3] LINEログインを設定する

LINEログインを利用すると、エンドユーザーはLINEアカウントを使ってWisdomBaseにログイン・会員登録できます。 WisdomBase用のIDやパスワードを新たに管理する必要がありません。

WisdomBaseでのメールアドレスの扱い

本記事でご案内するWisdomBaseのLINEログインでは、LINEアカウントに登録されているメールアドレスを取り込みません。 そのため、以下のいずれかの登録方法を事前に選択してください。

  • ダミーのメールアドレスを自動生成して登録する
  • 初回ログイン時に、WisdomBase上でメールアドレスの入力画面を表示する

事前準備

  • LINE Developersを利用できるLINE Business IDをご用意ください
  • WisdomBaseで実際に使用するドメインを確定してください
  • メールアドレスの登録方法を決めてください
  • LINE公式アカウントとの連携を行うかどうかを決めてください

LINEログインチャネルを設定する

  1. LINE Developersにログインします。
  2. プロバイダーを作成し、その配下にLINEログイン用のチャネルを作成します。
  3. チャネル名、チャネルアイコン、説明、連絡先など、設定画面に表示される必須項目を入力します。
  4. LINE Loginタブの「Callback URL」に、以下のURLを登録します。
    • https://[WisdomBaseのドメイン]/users/auth/line/callback
  5. 多言語機能を利用している場合は、追加するコールバックURLを弊社担当者へご確認ください。
  6. LINEログインチャネルを本番利用できる状態にします。
  7. Channel IDとChannel secretを確認します。
  8. 弊社担当者がご案内する安全な方法で、Channel IDとChannel secretを共有してください。 あわせて、メールアドレスの登録方法もお知らせください。

Channel secretは重要な秘密情報です。メール本文やチャットへ直接記載せず、弊社担当者が指定する方法で共有してください。

LINE公式アカウントと連携する場合

LINEログイン時にLINE公式アカウントの友だち追加を案内したい場合のみ、以下を設定します。

  1. LINE公式アカウント管理画面を開き、対象のLINE公式アカウントでMessaging APIを有効にします。
  2. Messaging APIのプロバイダーには、LINEログインチャネルと同じプロバイダーを指定します。
  3. LINE DevelopersでLINEログインチャネルを開き、「リンクされたLINE公式アカウント」を設定します。
  4. 友だち追加の案内方法として、bot_promptの値を選択し、弊社担当者へお知らせください。
    • normal：LINEログインの同意画面内に、友だち追加の選択肢を表示します
    • aggressive：同意画面の後に友だち追加の確認画面を表示し、友だち追加をより強く促します

LINE公式アカウントとの連携により、ログイン時に友だち追加を案内できます。 WisdomBaseの操作に連動してメッセージが自動配信されるわけではありません。メッセージ配信は、LINE公式アカウント側の機能で行ってください。

LINEログインとLINE公式アカウントの連携については、 LINE Developersの公式ドキュメントもあわせてご確認ください。

[4] 設定後に確認する

各サービスの認証情報を共有いただいた後、弊社にてWisdomBase側の設定を行います。 設定完了の連絡を受けたら、本番公開前に以下をご確認ください。

  • 新規ユーザーがソーシャルログインで会員登録できること
  • 登録済みユーザーが同じアカウントで再ログインできること
  • 認証をキャンセルした場合に、適切な画面へ戻ること
  • 想定したメールアドレスまたはダミーのメールアドレスが登録されること
  • 多言語機能を利用している場合は、各言語のログイン画面から認証できること
  • LINE公式アカウントと連携している場合は、想定した友だち追加画面が表示されること

WisdomBaseのドメインを変更した場合は、Google、Facebook、LINEの各管理画面に登録したリダイレクトURIまたはコールバックURLも更新する必要があります。 ドメイン変更前に、弊社担当者までご連絡ください。