🐼はじめに
この世にはソーシャルログインというものがある。
「GoogleIDでログイン」「TwitterIDでログイン」「FacebookIDでログイン」と言ったもので、
既に様々なサイトで利用されている。
今回は「DiscordIDでログイン」が実装できるように頑張りましょう。
更新
2023/02/02 更新
参照
目次
- Discord Developer Portal にてApplicationを登録
- 「CLIENT ID」「CLIENT SECRET」を取得
- Oauth用URLを作成
- 作成したURLを実行し「code」を取得する
- 「code」を「token」に変換する
- 「token」と共にアクセスしユーザ情報を得る
- リフレッシュトークンでアクセスしアクセストークンを再取得する
Discord Developer Portal にてApplicationを登録
「CLIENT ID」「CLIENT SECRET」を取得
Discord Developer Portal にログイン
https://discord.com/developers/applications
右上にある「New Application」をクリック
任意のアプリケーション名を付けてください。
ここではOauthTestとする。
「Create」をクリックするとアプリケーションの登録が完了。
赤枠で囲った部分が「CLIENT ID」(左)「CLIENT SECRET」(右/クリックすると表示)。
このようになっている場合は 「Reset Secret」を押すことで新規に生成できる。
Oauth用URLを作成
自サイトに戻るときのURLを入力する。
自サイト ＞ Discordログイン画面 ＞ 自サイト(←ここ)
ここではhttp://localhost:8080/afterloginを例とする。
下部の「SCOPE」(どういう情報が欲しいか) にチェックを入れ、生成されたURLをコピーする。
ここでは、identify(DiscordのID番号のこと) と email を選択する。
見ての通り生成されたURLは、
https://discord.com/api/oauth2/authorize?client_id=CLIENT ID&redirect_uri=リダイレクト先&response_type=code&scope=スコープ
となっている。
作成したURLを実行し「code」を取得する
前項で作成したURLを実行し、URLパラメータから「code」部分の値を取得する。
検証段階ではアクセス可能ではないサイトでも良い。
実際のシステムに組み込む場合は、戻り先ページに
1.
次項以降の処理を行った上でリダイレクトさせる。
認証後のURLパラメータ （code=コード）
「code」を「token」に変換する
以下の形式でcurlコマンドにてAPIを叩く。（赤文字は適宜置換してください）
今回はPowerShell7を使用。
curl -X POST -H "Content-Type:application/x-www-form-urlencoded" -d "client_id=CLIENT ID&client_secret=CLIENT SECRET&grant_type=authorization_code&code=コード&redirect_uri=リダイレクト先（認証URLのものと同一である必要あり）" https://discordapp.com/api/oauth2/token
以下のような応答が来た場合は成功している。
{"access_token": アクセストークン, "expires_in": 604800, "refresh_token": リフレッシュトークン, "scope": スコープ, "token_type": "Bearer"}
コードは使い捨てのため、同じコードでの再度のアクセスは不可。
アクセストークンの有効時間は 604800 秒、つまり１週間。
切れる前にリフレッシュトークンにて新しいアクセストークンを要求する必要あり。
「token」と共にアクセスしユーザ情報を得る
アクセストークンを使用してユーザの情報を取得する。
以下の形式でcurlコマンドにてAPIを叩く。
curl -H "Authorization: Bearer アクセストークン" https://discordapp.com/api/users/@me
以下のような応答が来た場合は成功している。
{"id": Discord ID, "username": ユーザ名, "avatar": アバターID, "discriminator": ユーザ名識別番号(ユーザ名#の後ろの番号), "public_flags": 0, "flags": 0, "email": メールアドレス, "verified": true, "locale": 言語, "mfa_enabled": false}
アイコンは
https://cdn.discordapp.com/avatars/Discord ID/アバターID
でアクセス可能。
リフレッシュトークンでアクセスしアクセストークンを再取得する
以下の形式でcurlコマンドにてAPIを叩く。
curl -X POST -H "Content-Type:application/x-www-form-urlencoded" -d "client_id=CLIENT ID&client_secret=CLIENT SECRET&grant_type=refresh_token&refresh_token=リフレッシュトークン" https://discordapp.com/api/oauth2/token
以下のような応答が来た場合は成功している。
{"access_token": アクセストークン, "expires_in": 604800, "refresh_token": リフレッシュトークン, "scope": スコープ, "token_type": "Bearer"}
🐼最後に
「Discordでログイン」を流行らせて行きましょう。
時代はDiscord！