DiscordにWordEngineの取り組み状況を表示するPreMiD Activityを作ったので紹介

[!NOTE] 導入方法だけ読みたい方は 導入手順 まで飛ばしてください。
はじめに
Discordにはアクティビティ(旧名: Rich Presence)という、今遊んでいるゲームや聴いている音楽を自分のプロフィールに表示する機能があります。
この機能のおかげで、自分が今何をやっているのかを友達に共有したり、逆に友達が今何をやっているのかを簡単に知ることができます。
高校まではかなり仲が良い人としかDiscordは繋いでいませんでしたが、大学ではStudent Hubというものがあったり、Discordを使用しているサークルが多いという関係で、そこまで親しみがない人とも繋がりができやすくなりました。
つまり、自分が色んな人のアクティビティを見る機会が増えたり、自分のアクティビティが他の人に見られる機会が増えるというわけです。
ということで、せっかくなら色んな情報をアクティビティに表示させたい!と思い、弊学1,2年生必修科目のVirtual English Programで毎週取り組むことが必須となっている英語学習アプリ『WordEngine』の取り組み状況をアクティビティに表示できるようにしようと考えました。
先行研究(?)の調査と結論
既に同じことをしている人がいないか探してみたところ、いました。
ただ、こちらの方法はある程度知識がないと使うまでのセットアップが難しいということ、それに加えて作者の方がメンテナンスを終了したと宣言しているため、より簡単な方法で使えるようにしようということで、PreMiDを利用する形で新たに作成しました。
PreMiDってなに?
PreMiDとは、ブラウザで見ているWebサイトや動画の情報を、Discordのアクティビティにリアルタイムで自動表示できるブラウザ拡張機能です。オープンソースのため、ルールに従えば誰でもアクティビティの表示対象とするウェブサイトを追加申請することができます。

Discordにアクティビティを表示するためには、原則、任意のアプリケーションがPC版のDiscordクライアントに対して情報を送信する必要があります。(データベースに登録されているゲームの場合、Discord側がゲームの起動状況を検出して表示させています。)
しかし、PlayStationやXboxでゲームを遊んでいるという情報や、一部オンラインゲーム(スタレ, NTE等)、Spotifyなどは、それぞれのサービスのアカウントと自分のDiscordアカウントを接続することで、サーバー側で自分のDiscordアカウントに対してアクティビティの表示・更新処理を行ってくれます。
※ここまでにわか知識です。間違ってたらDMかなにかで指摘してください。
PreMiDは後者の方法でアクティビティを表示できるため、ブラウザに拡張機能をインストールして自分のDiscordアカウントとPreMiDと連携するだけでアクティビティが表示できるようになります。要は、WordEngineの進捗状況を表示するためだけに専用のアプリをPCにインストールしたり起動させておいたりする必要がない、ということです。
導入手順
[!NOTE] 今回はGoogle Chromeを用いて説明しますが、Edge, Firefox, Safari,
その他Chromium系ブラウザでも利用可能です。OSも何でもいいはずです。
[!IMPORTANT] このプログラムはWordEngineのhtmlから情報を読み取るだけなので、まず起こり得ないとは思いますが、万が一WordEngineやDiscordのアカウント、PCなど何かしらに損害が発生した場合、作者は一切の責任を負いません。
自己責任でご利用ください。
PreMiD公式サイトのダウンロードページ を開き、「Chromeに追加」ボタンをクリック

Edgeなら「Edgeに追加」のように、ブラウザによって表示が変わります Chrome ウェブストアに飛ばされるので、「Chrome に追加」をクリック

他のブラウザでも同じような追加するボタンがあるはず 完了すると新しいタブで「Welcome to PreMiD」という画面が表示されるので、
「Get Started」→「Connect with Discord」と進む

Discordに飛ばされるので、自分のDiscordアカウントにログイン後、「認証」をクリック

PreMiDの画面に戻ったら「Choose Activities」をクリック

アカウントが違う場合、「Use different account」でもう一度Discordのログインからやり直せます デフォルトのアクティビティが提案されるので、必要に応じてクリックで有効/無効を切り替えたあと、「Browse Activity Library」をクリック

WordEngineの表示だけをしたいなら全部RemoveにしてOK PreMiDのライブラリページ に飛ばされるので、検索窓に「WordEngine」と入力

検索結果のWordEngineを選択して、「Add Activity」をクリック

ブラウザ右上の拡張機能アイコンからPreMiDをクリックし、「Open Extensions Page」をクリック
※画像のようなメッセージがPreMiDの画面に表示されていない場合、下記の文字列をコピーしてアドレスバーに貼り付けてください。
青丸の場所をクリックしてピン留めすると便利(必須ではない)
chrome://extensions/?id=agjnjboanicjcpenljmaaigopkgdnihi拡張機能の設定画面が開くので、「ユーザー スクリプトを許可する」をオンにする

PreMiDがWordEngineで学習した単語数や取り組み中のコースなどを取得するために必要な権限です
以上で完了です。
WordEngineを開いて画面上部にこのような表示が出てきたらDiscordにアクティビティが表示されているはずです。
PreMiDの設定
PreMiDを入れると、対応しているウェブサイトでアクティビティを追加しないかという提案を表示してきますが、正直邪魔だなと思うことが多いので無効にする方法も載せておきます。
(先述の手順9を参照)PreMiDのメニューを開き、右上の設定アイコンをクリック

「Language」を「日本語」に設定したあと、「アクティビティ提案」をオフにする

WordEngineを開いたときに出てくる「ステータス表示中」の表示も消したいなら「通知」もオフに
FAQ
アクティビティが表示されない
Discordのアカウント設定でアクティビティを共有しない設定になっている可能性があります。「アクティビティのプライバシー」より「アクティビティを共有」がオンになっていること、「アクティビティを表示するサーバー」が「すべてのサーバーで共有」になっていることを確認してください。また、その下の「マイサーバー」でサーバー別に共有設定がオフになっていないかも確認してみてください。
WordEngineのタブやブラウザを閉じても、Discordへの表示が消えないことがある
即時クリアはPreMiDのプレミアムプランの特典となっていることから、サーバー側の制約によるものと考えられます。消えるまで最長20分かかることがあるようですが、私の経験上、WordEngineのタブを開いた状態でそのタブを閉じるとすぐに消えてくれることが多いです。
よき英語学習を
これがあなたのWordEngineのモチベーション向上に寄与すれば幸いです。
このプログラムを作る時間とこの記事を書く暇があったら何単語学習できたのか、という点には触れないでください…