Discord掲示板サービス(Distopia)を作ってみた
Discord掲示板サービス(Distopia)を作ってみた
この記事はこの度作成したDistopiaについて制作過程において難しかった部分を説明する記事です。
需要が少ないかもしれませんが、自分が忘れないためにも書いておきます。参考になればうれしいです。
すべてのコードについて解説を入れると日が暮れてしまうので詳しいコードについてはこの記事では書きません。それについては、次回作をご期待だください。
失敗例に対する対策だけ見たい方はこちらを先にご覧ください
↓↓↓今回制作したもの↓↓↓
1: DiscordのOauthの資料が少なすぎる
作るうえでこれが一番難しかったのがこれです。
それもそのはず、Discord公式のドキュメントは以下の1ページのみで製作途中でエラーが出た場合はStackOverFlowを頼るしかありません
自分が英語弱者なのも相まってOauthのWrapperを作るのが大変でした。
例えば...
DiscordのOauthでユーザーをサーバーに追加するには以下のようなエンドポイントにPUTメゾットで送信することなどは公式Docsに書いてありましたがBot Tokenがヘッダーに必要な事は書いてありませんでした。
`https://discord.com/api/v10/guilds/${guildId}/members/${userId}`
ユーザーが入っているサーバーの一覧取得などはaccess_tokenのみで通るので、ここはStackOverFlowを見るまで何故ダメなのか分かりませんでした。
access_tokenがbodyで要求されるときはヘッダーにTokenが必要な場合が多いという法則性に気づいたときには既にサービスは完成していました。
2: Discordボット関係のトラブル頻発
開発段階で発生した主なものは以下の通りです。
管理者以外もコマンドを実行出来てしまう。
こんなの以下のようなコードを組み込めば、いくらでも対処できるんですが長時間作業などで一か所書き忘れていました ((涙
if (!interaction.member.permissions.has(PermissionsBitField.Flags.Administrator)) {
console.log("管理者じゃないよ‼");
}
ちなみに翌日に自分で気づいて急いで直しました。気づいたのがマージ前でよかったです。
リリース当日までHelpコマンドの実装をド忘れする。
正式リリースが12/6で、それまでにはやっておく予定だったのですが、見事当日までド忘れ。
当日にTODOリストを確認していて気付いて急いで直しました。
3: クライアントサイドでの画像合成
今回自分が作ったDiscord掲示板であるDistopiaは以下のように上位サーバーのアイコンに縁が付くようになっています。
当初はサーバー側での合成を考えていたのですが数十分おきの更新ごとに上位サーバーすべてに画像合成をするのは流石にサーバーリソースを食うなと思ったのでクライアント側での合成を決行。
※この話に関して詳しく書くと記事がまた別に一個かけてしまうのでここでは簡潔に説明させていただきます。詳しい解説については今後上げます。
ここで重要になるのはcanvasタグです。
二つのcanvasタグを使い、1つ目で画像を丸く加工、2つ目で事前に用意した縁と合成といった具合です。
これによって一見重そうに見えるアイコンの縁加工をサーバーに一切負担をかけずに行っています。
詳しくは以下をご覧ください
対策一覧
死ぬほど調べれば基本的に答えは出てくる
DiscordのOauthなど資料が少ないものも多いですが基本エラー文で検索をかけたり海外の質問サイト(StackOverFlow)を見れば大体載ってます。
困った時は以下のサイトを見ることをお勧めします。
変なところで意地を貼らない
今後追加予定の機能もあるので詳しくは言えませんが自分は正式リリースまでの間にいくつか機能の実装を先送りにしています。
理由はそれらの機能を作ろうとすると極端に時間がかかるからです。
自分は実装する技術を絞ることで少ないメンバーでも短い期間でサービスを構築することが出来ました。
機能追加や仕様変更はいくらでも後から出来ます。
少ない人数で短い期間で制作するなら、ちゃんと取捨選択しましょう。
TODOリストを作る
ド忘れしないためにはTODO.mdを作っておいて逐一確認
自分は今回の開発を通してTODO.mdを見る習慣をつけようと実感しました。
詳しい書き方については以下を見ることをお勧めします。
最後に
あくまで自分の為に書いた記事なので雑な部分があったら申し訳ないです。
これを機に今回自分が作ったサイトなども確認していただけると幸いです。
閲覧ありがとうございました。
Discussion