Udonarium Axe Backend

Discordのアプリを作る ​

サーバー版（Cloudflare版と、Vercel版の部屋のサーバー）では、GMとPLがDiscordのアカウントでログインして部屋に入ります。そのために、サーバーを置く人が、Discordのアプリを1つ作ります。このページは、その作りかたの手順です。かかる時間は10分ほどです。

アプリといっても、プログラムを書くわけではありません。Discordに「このサーバーからログインを頼む」と登録し、ログインに使うClient IDとClient Secretを受け取るだけです。ボット（Bot）は作りません。

Discordの画面の言葉

Discord Developer Portal（アプリを作る画面）は英語で表示されます。このページでは、ボタンやメニューの名前を画面の表示のまま英語で書きます。

0. 用意するもの ​

  • Discordのアカウント（ふだん使っているもので構いません）
  • 部屋のサーバーのURL（手順3で使います。まだ決まっていなければ、手順2まで進めて、あとで戻ってきます）

1. アプリを作る ​

  1. Discord Developer Portalを開き、Discordのアカウントでログインします。
  2. 右上のNew Applicationを押します。
  3. 「Create a new app」の画面で、Nameに名前を入れます。この名前は、ログインのときにDiscordが出す確認の画面で、ログインする人に見えます。卓や配信の名前にすると分かりやすくなります（例：Udonarium Axe）。
  4. Teamの欄は、Discordのチームに入っている人にだけ出ます。出たときは、Personalのままにします。
  5. 「By clicking Create, you agree to the Discord Developer Terms of Service and Developer Policy.」のチェックを入れます。開発者向けの規約に同意するという意味です。
  6. 名前とチェックがそろうと、Createが押せるようになります。押します。
  7. 人間かどうかを確かめる画面が出たら、案内に従って答えます。

アプリの画面（General Information）が開きます。アイコンや説明は、入れなくても動きます。

2. Client IDとClient Secretを控える ​

  1. 左のメニューのOAuth2を開きます。
  2. Client informationの欄の、Client IDの下のCopyを押し、どこかに貼り付けて控えます。
  3. Client Secretは、「Hidden for security」と伏せてあります。その下のReset Secretを押します。
  4. 「Regenerate Secret Key?」と、本当に作り直すかを尋ねられます。作ったばかりのアプリなので、作り直しても困ることはありません。Yes, do it! を押します。2段階認証を設定しているアカウントでは、6けたの確認のコードを求められることがあります。
  5. 「A new token was generated! Be sure to copy it as it will not be shown to you again.」と出て、新しいClient Secretが見えるようになります。Copyを押して控えます。

Client Secretは一度しか出ません

画面を離れると、Client Secretはもう見られません。控え忘れたときは、もう一度Reset Secretを押して作り直します。作り直すと前のものは使えなくなるので、サーバーに入れた値も入れ替えます。Client Secretは、ほかの人に見せないでください（→ 設置の準備）。

控えた2つは、サーバーの設定に入れます。

サーバーの設定の名前入れるもの
DISCORD_CLIENT_IDClient ID
DISCORD_CLIENT_SECRETClient Secret

3. 戻り先のURLを登録する ​

Discordでログインしたあと、Discordは決められたURLにだけ戻ります。

その戻り先として、部屋のサーバーのURLを登録します。部屋のサーバーのURLは、デプロイが終わると決まります。

  1. Discord Developer Portalで、作ったアプリを開き、左のメニューのOAuth2を開きます。

  2. Redirectsの欄のAdd Redirectを押します。すでに1つ登録してあるときは、ボタンの名前がAdd Anotherになっています。

  3. 出てきた欄に、次の形のURLを入れます。

    text
    https://<部屋のサーバーのドメイン>/v1/login/discord/callback
    部屋のサーバー入れるURLの例
    Cloudflare版（workers.dev）https://udonarium-axe-backend.yourname.workers.dev/v1/login/discord/callback
    Vercel版https://my-udonarium-rooms-vercel.vercel.app/v1/login/discord/callback
    カスタムドメインhttps://backend.example.com/v1/login/discord/callback

  4. 画面の下に「Careful — you have unsaved changes!」という帯が出るので、Save Changesを押します。押さないと、登録されません。

  5. 帯が消えれば、登録できています。「You provided an invalid redirect URI.」と出たときは、URLの形が違います。https://から始まっているか、前後に空白が入っていないかを確かめます。

ドメインの部分は、Axeのconfig.jsonのbackend.urlに書くのと同じにします。URLは上の形のとおりに書き、末尾に/を付けません。1文字でも違うと、ログインのときにDiscordがInvalid OAuth2 redirect_uriを出します。カスタムドメインを付けたときなど、ドメインを変えたときは、新しいURLを足します。戻り先は、1つのアプリに複数登録できます。運営する人の管理画面を使うときは、同じドメインで末尾を/admin/login/callbackにしたURLも足します（→ 管理画面とBAN）。

ほかの設定について ​

ログインに使うのは、ここまでの設定だけです。Botの画面や、OAuth2の画面のOAuth2 URL Generatorは使いません。OAuth2の画面のPublic Clientは、オフのままにします。部屋のサーバーがDiscordに求めるのはidentifyだけで、ログインした人のユーザーID、名前、アイコンを受け取ります。メールアドレスや、入っているサーバーの一覧は求めません。

次に読むもの ​

MITライセンスで公開しています

Udonarium Axe Backend