OAuth 2.0 サンプルアプリ

*このコンテンツは、ベータ版のAI（人工知能）を使用して翻訳されており、エラーが含まれている可能性があります。このページを英語で表示するには、 こちら をクリックしてください。

Roblox は、OAuth 2.0 を使用してユーザーが Roblox アカウントにログインし、経験全体でメッセージを送信する方法を示す Node.js サンプルアプリを提供します。このアプリケーションは、認可コードフローをPKCEなしで使用し、それゆえプライベートサーバーなどの機密クライアントにのみ適しています。


.zip ファイルをダウンロードした後、自分のフォルダに抽出します。

アプリを登録する

アプリを設定する最初のステップは、Roblox ウェブサイトに登録することで、クライアントIDと秘密を安全な場所にコピーします。次に、これらの設定で標準の登録ステップを順に実行します：

  1. 権限 の下で、openid、profile、およびuniverse-messaging-service:publishスコープを追加します。
  2. リダイレクト URLs の下で、http://localhost:3000/oauth/callback リダイレクトを追加します。アプリのデフォルトのポートではないものを使用したい場合は、ここで指定します。

環境変数を設定する

コードに保存するのではなく、アプリはクライアント IDと秘密のための環境変数を使用します。環境変数の追加プロセスは、オペレーティングシステムによって異なります。

Windows では、次の PowerShell コマンドを実行します：

$env:ROBLOX_CLIENT_ID='your_client_id_here'

$env:ROBLOX_CLIENT_SECRET='your_client_secret_here'

$env:ROBLOX_PORT=3000 # Optional. Default is 3000.

Mac とほとんどの Linux 配布では、ターミナルでこれらのコマンドを実行します：

export ROBLOX_CLIENT_ID=your_client_id_here

export ROBLOX_CLIENT_SECRET=your_client_secret_here

export ROBLOX_PORT=3000 # Optional. Default is 3000.

アプリを登録するときにリダイレクト URL に非デフォルトのポートを指定した場合、ROBLOX_PORT 変数を追加することを忘れないでください。

依存性をインストールする

アプリには依存関係が数個あり、package.json に表示されます。それらをインストールするには、実行してください：

npm ci

アプリを実行

アプリを開始するには、実行します：

npm start

次に、ウェブブラウザで http://localhost:3000 (またはデフォルトでないポート) に移動します。

アプリはすぐに Roblox のログイン画面にリダイレクトし、そこでログインし、アプリがリクエストしている権限を確認し、 確認してアクセスを与える をクリックします。

Roblox はその後、localhost にリダイレクトし、アプリが現在、最小限のユーザー情報を表示し、Roblox のプロフィールへのリンク、およびエクスペリエンス全体でメッセージを送信できるフィールドを表示できることを確認できます。

アプリについて

大まかに言えば、index.js は次の操作を実行します：

  1. express を使用して新しいウェブサーバーを開始します。
  2. 認証、ユーザー情報などを含む Roblox OpenID Connect (OIDC) 構成を取得するこれらのエンドポイントに関する詳細情報は、OAuth 2.0 認証 を参照してください。
  3. openid-client と保存されたクレデンシャルを使用して、新しいオープンIDクライアントを作成します。このクライアントは、HTTP リクエストを適切に形式化して OAuth 2.0 エンドポイントに送信するプロセスをドラマチックに簡素化します。
  4. アプリのルートを定義し、ログインおよびログアウトフローと OAuth 2.0 コールバックのリダイレクトを含みます。
  5. ログインに成功した後、getHomeHtml.js の助けを借りて HTML で表示される少数のユーザー情報とともに、様々なトークンをクッキーとして保存します。