X を使用してソーシャルログインを設定する

X（旧 Twitter）ソーシャルサインインのための公式 Logto コネクター。

ヒント:

このガイドは、Logto コネクターについての基本的な理解があることを前提としています。未経験の方は、コネクターガイドを参照して始めてください。

はじめに

X (Twitter) コネクターを使用すると、エンドユーザーは X OAuth 2.0 認証プロトコルを介して自分の X (Twitter) アカウントを使用してアプリケーションにサインインできます。

X Developer Portal にアクセスし、X アカウントでサインインします。アカウントをお持ちでない場合は、登録できます。

その後、アプリを作成します。

ステップ 1: アプリ作成セクションに移動します。

サインインしたら、「Projects & Apps」セクションに移動し、「Create App」（またはインターフェースによっては 「New App」）をクリックします。

ステップ 2: アプリの詳細を入力します。

次の情報でフォームを完成させます：

App Name: アプリケーションの一意で説明的な名前を提供します。
Application Description: （オプション）アプリの機能について簡単に説明を追加します。
Website URL: アプリケーションのホームページの URL を入力します。
Callback URL / Redirect URI: この場合、${your_logto_endpoint}/callback/${connector_id} になります。例：https://foo.logto.app/callback/${connector_id}。connector_id は Logto Admin Console のコネクター詳細ページの上部バーにあります。

ステップ 3: 権限とスコープを選択します。

アプリに必要な権限を選択します。X を介したソーシャルサインインの場合、必要なスコープ tweet.read と users.read を有効にしてください。

ステップ 4: アプリを保存します。

「Create」 または 「Save」 をクリックしてアプリを登録します。

作成後、アプリの 「Keys and tokens」 セクションに移動して、OAuth 2.0 Client ID と Client Secret を取得します。

Logto コネクター設定で、アプリの「Keys and tokens」ページの「OAuth 2.0 Client ID と Client Secret」セクションから取得した値で次のフィールドを入力します：

scope はスペースで区切られたスコープのリストです。指定しない場合、デフォルトのスコープは tweet.read users.read です。

これで完了です。X (Twitter) コネクターが利用可能になっているはずです。サインイン体験でソーシャルコネクターを有効にするのを忘れないでください。

X OAuth 2.0 認可コードフローと PKCE