メインコンテンツまでスキップ
新しい友達のために:

Logto は、モダンなアプリや SaaS 製品向けに設計された Auth0 の代替です。 Cloud と オープンソース の両方のサービスを提供し、アイデンティティと管理 (IAM) システムを迅速に立ち上げるのに役立ちます。認証 (Authentication)、認可 (Authorization)、マルチテナント管理を すべて一つに まとめて楽しんでください。

Logto Cloud で無料の開発テナントから始めることをお勧めします。これにより、すべての機能を簡単に探索できます。

この記事では、WordPress プラグイン と Logto を使用して、Kakao サインイン体験（ユーザー認証 (Authentication)）を迅速に構築する手順を説明します。

前提条件

Logto でアプリケーションを作成する​

Logto は OpenID Connect (OIDC) 認証 (Authentication) と OAuth 2.0 認可 (Authorization) に基づいています。これは、複数のアプリケーション間でのフェデレーテッドアイデンティティ管理をサポートし、一般的にシングルサインオン (SSO) と呼ばれます。

あなたの 従来のウェブ アプリケーションを作成するには、次の手順に従ってください：

  1. Logto コンソール を開きます。「Get started」セクションで、「View all」リンクをクリックしてアプリケーションフレームワークのリストを開きます。あるいは、Logto Console > Applications に移動し、「Create application」ボタンをクリックします。 Get started
  2. 開いたモーダルで、左側のクイックフィルターチェックボックスを使用して、利用可能なすべての "従来のウェブ" フレームワークをフィルタリングするか、"従来のウェブ" セクションをクリックします。"WordPress" フレームワークカードをクリックして、アプリケーションの作成を開始します。 Frameworks
  3. アプリケーション名を入力します。例：「Bookstore」と入力し、「Create application」をクリックします。

🎉 タダーン！Logto で最初のアプリケーションを作成しました。詳細な統合ガイドを含むお祝いページが表示されます。ガイドに従って、アプリケーションでの体験を確認してください。

WordPress SDK を統合する​

プラグインのインストール​

備考:

現在、プラグインはまだ審査中で、WordPress プラグインディレクトリにはありません。利用可能になり次第、このページを更新します。

  1. 次のリンクのいずれかから Logto WordPress プラグインをダウンロードします：
    • 最新リリース：logto-plugin-<version>.zip 形式のファイルをダウンロードします。
  2. プラグインの ZIP ファイルをダウンロードします。
  3. WordPress 管理パネルで プラグイン > 新規追加 に移動します。
  4. プラグインのアップロード をクリックします。
  5. ダウンロードした ZIP ファイルを選択し、今すぐインストール をクリックします。
  6. 有効化 をクリックします。

プラグインの設定​

これで、WordPress 管理パネルのサイドバーに Logto メニューが表示されるはずです。Logto > 設定 をクリックしてプラグインを設定します。

注記:

プラグインを設定する前に、Logto コンソールで 従来のウェブ アプリケーションを作成しておく必要があります。まだ作成していない場合は、アプリケーションへの Logto 統合 を参照してください。

プラグインを開始するための最小限の設定は次のとおりです：

  • Logto エンドポイント：Logto テナントのエンドポイント。
  • アプリ ID：Logto アプリケーションのアプリ ID。
  • アプリシークレット：Logto アプリケーションの有効なアプリシークレットのいずれか。

すべての値は Logto コンソールのアプリケーション詳細ページで見つけることができます。

値を入力したら、変更を保存 をクリックします（ボタンが見つからない場合はページの下までスクロールしてください）。

リダイレクト URI の設定​

リダイレクト URI は、ユーザーが認証された後に Logto がリダイレクトする URL です。また、サインアウト後のリダイレクト URI は、ユーザーがログアウトした後に Logto がリダイレクトする URL です。

サインインフローを説明する非規範的なシーケンス図はこちらです：

サインアウトフローを説明する非規範的なシーケンス図はこちらです：

リダイレクトが必要な理由について詳しくは、サインイン体験の説明 を参照してください。

この場合、Logto コンソールで両方のリダイレクト URI を設定する必要があります。リダイレクト URI を見つけるには、WordPress 管理パネルの Logto > 設定 ページに移動します。リダイレクト URI と サインアウト後のリダイレクト URI フィールドが表示されます。

  1. リダイレクト URI と サインアウト後のリダイレクト URI の値をコピーし、Logto コンソールの リダイレクト URI と サインアウト後のリダイレクト URI フィールドに貼り付けます。
  2. Logto コンソールで 変更を保存 をクリックします。

チェックポイント：WordPress ウェブサイトのテスト​

これで、WordPress ウェブサイトで Logto 統合をテストできます：

  1. 必要に応じてシークレットブラウザウィンドウを開きます。
  2. WordPress ウェブサイトを訪問し、該当する場合は ログイン リンクをクリックします。または、直接ログインページ（例：https://example.com/wp-login.php）を訪問します。
  3. ページは Logto サインインページにリダイレクトされるはずです。
  4. サインインまたはサインアッププロセスを完了します。
  5. 認証が成功すると、WordPress ウェブサイトに戻り、自動的にログインされるはずです。
  6. ログアウト リンクをクリックして WordPress ウェブサイトからログアウトします。
  7. Logto サインアウトページにリダイレクトされ、その後 WordPress ウェブサイトに戻るはずです。
  8. WordPress ウェブサイトからログアウトされているはずです。

WordPress プラグインの設定について詳しく知るには、 WordPress クイックスタート を参照してください。

Kakao コネクターを追加する​

迅速なサインインを有効にし、ユーザーコンバージョンを向上させるために、アイデンティティプロバイダー (IdP) として WordPress を接続します。Logto ソーシャルコネクターは、いくつかのパラメーター入力を許可することで、この接続を数分で確立するのに役立ちます。

ソーシャルコネクターを追加するには、次の手順に従ってください：

  1. Console > Connectors > Social Connectors に移動します。
  2. 「Add social connector」をクリックし、「Kakao」を選択します。
  3. README ガイドに従い、必要なフィールドを完了し、設定をカスタマイズします。
Connector tab
注記:

インプレースコネクターガイドに従っている場合は、次のセクションをスキップできます。

Kakao login を設定する​

Kakao Developers Console でプロジェクトを設定する​

  • Kakao Developers Console にアクセスし、Kakao アカウントでサインインします。
  • アプリケーションを追加 をクリックして新しいプロジェクトを作成するか、既存のプロジェクトを選択します。

Kakao ログインを設定する​

Kakao ログインを有効化する​

  • メニューから 製品設定 -> Kakao ログイン をクリックします。
  • Kakao ログインの有効化 をオンにします。
  • 以下の URL を リダイレクト URI に追加します。
    • http(s)://YOUR_URL/callback/${connector_id} (connector_id は Logto 管理コンソールのコネクター詳細ページの上部バーで見つけることができます。)
    • (YOUR_URL を Logto の URL に置き換え、状況に応じて http または https を選択してください。)

プライバシー設定​

  • メニューから 製品設定 -> Kakao ログイン -> 同意項目 をクリックします。
  • ニックネーム、プロフィール画像、および メール の状態を 必須同意 に変更します（プロジェクト設定によっては メール を 必須同意 に変更できない場合があります）。

セキュリティ設定（オプション）​

  • メニューから 製品設定 -> Kakao ログイン -> セキュリティ をクリックします。
  • クライアントシークレットコード をクリックしてシークレットコードを生成します。
  • 有効化状態 を有効に変更します。（有効にすると、シークレットコード が必要です。）

Logto を設定する​

設定タイプ​

名前タイプ
clientIdstring
clientSecretstring?

clientId​

clientId はプロジェクトの REST API キー です。 (Kakao developers console のプロジェクトの 概要 から見つけることができます。)

clientSecret​

clientSecret はプロジェクトの シークレットコード です。 (セキュリティ設定（オプション） を確認してください。)

設定を保存する​

Logto コネクター設定エリアで必要な値をすべて記入したことを確認してください。「保存して完了」または「変更を保存」をクリックすると、Kakao コネクターが利用可能になります。

サインイン体験で Kakao コネクターを有効にする​

ソーシャルコネクターを正常に作成したら、サインイン体験で「Kakao で続行」ボタンとして有効にすることができます。

  1. Console > サインイン体験 > サインアップとサインイン に移動します。
  2. （オプション）ソーシャルログインのみが必要な場合は、サインアップ識別子に「該当なし」を選択します。
  3. 設定済みの Kakao コネクターを「ソーシャルサインイン」セクションに追加します。
サインイン体験タブ

テストと検証​

WordPress プラグイン アプリに戻ります。これで Kakao を使用してサインインできるはずです。お楽しみください！

さらなる読み物​

エンドユーザーフロー：Logto は、MFA やエンタープライズシングルサインオン (SSO) を含む即時使用可能な認証 (Authentication) フローを提供し、アカウント設定、セキュリティ検証、マルチテナント体験の柔軟な実装のための強力な API を備えています。

認可 (Authorization)：認可 (Authorization) は、ユーザーが認証 (Authentication) された後に行えるアクションやアクセスできるリソースを定義します。ネイティブおよびシングルページアプリケーションの API を保護し、ロールベースのアクセス制御 (RBAC) を実装する方法を探ります。

組織 (Organizations)：特にマルチテナント SaaS や B2B アプリで効果的な組織機能は、テナントの作成、メンバー管理、組織レベルの RBAC、およびジャストインタイムプロビジョニングを可能にします。

顧客 IAM シリーズ：顧客（または消費者）アイデンティティとアクセス管理に関する連続ブログ投稿で、101 から高度なトピックまでを網羅しています。