シンプル AutoReply Discord ボット


## 目的

Discord にシンプルボットを作成方法を説明します。
今回のメイン機能は、Discordサーバーに決めたワードの投稿・コメントがあれば、その投稿に決めた文字列で返信をすること。
|　　　　　　　　  　　　　　　　　   　　　　　   　　　　　　　　　　　　　　　　　　　　|
|:-:|
![zpic00.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/57e2927c-ee5a-9305-3d74-6f01719b58f3.png)
サーバーメンバーがローマ字の「pien」をコメントしたら、同じくボットが「pien 🥺」（＋絵文字付き）で返す。

ボットのソースコードは、node.js とDiscord API で書かれています。
ボットのホストは、自分のPC（私の場合は、MACBookのターミナル）となりますので、ターミナルや PC がシャットダウンされたらボットがオフライン状態となります。
(もちろん24/7 Standbyにする方法はいくつかあります！後ほど説明します。)



## Discord 側のボット設定

1. ログインした状態で以下のURLより新規アプリを作成。
https://discord.com/developers/applications

2. New Application ボタンをクリック。
![zpic1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/33d683a6-5b93-0d26-1713-809e5c532f6a.png)
Applicationに名前を付ける。
![zpic2.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/5a478736-f669-ab0e-8b0e-eda095cfbda5.png)

3. Application ができたら、ボットの立ち上げができます。
Bot タブより、Add Bot ボタンをクリック。
![zpic3.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/39facac8-3ac9-3e11-31f6-ce395feb58ea.png)
ボットの追加を確認。
![zpic4.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/423e6815-5a7f-fe61-7cc0-4ed05fc9571b.png)

4. ボットに名前を付ける。
新規ボットに、Token という文字列が表示されます。Copyボタンでコピーして保存します。
（注意）このTokenは、Gitレポジトリなどに公開しないように注意しましょう。
間違って公開さればDiscord側より無効化にされる場合があります。
![zpic5e.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/cc342faa-0513-a93d-55e1-387a27b1e5e1.png)
少し下の方に、以下のボタンをチェックを付けます。
「Presence」「Server Members」「Message Content」３つの Intent 有効化のオプションがあります。
ボットの機能や使い方によって、どちらをチェック必要か変わりますが、
メッセージの AutoReply の場合は Presence と Message Content だけで結構です。
![intents.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/f5aa34eb-b181-c9d9-1442-a22ddf90b887.png)



5. 権限を与える。
OAuth2タブより、URL Generator タブに移動。
Scopeの枠の Bot にチェックを付ける。
![zpic6.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/6a592a08-2597-a2f4-ed15-3938c82be6e8.png)
すると、ボットにだいたいの必要な権限が下部分の枠に表示されます。
この中に与えたい権限を選びましょう。
![zpic6b.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/88e73b64-2094-481e-fe07-7a2e5d536bbe.png)
ボット機能によって必要な権限が変わりますが、AutoReplyの場合は Message権限の辺りで充分。
※与える権限を迷ったら、Administrator権限を与えると楽なんですが、行き先サーバーにAdministrator権限持っていないと招待できないし、ボットの間違いでサーバーを壊す危険性もあるし、気を付けてください。
![zpic6c.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/636748e2-2c2e-0462-e71f-51858bc07250.png)
生成されたURLをコピーして、ブラウザーよりアクセスします。

6. ボットをサーバーへ招待。
この段階では、ボットには何も機能が入らず、ただの空ボットです。
念のため、メンバーがたくさん入っているサーバーなどへ招待するをお控えください。
自分のみが入っているテストダミーサーバーがおすすめです。
![zpic7.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/707c0e99-45af-0ea5-588a-81456b45dc1d.png)



## ボットの Code & Hosting
ボットは、オンライン状態で立ち上がっている限り動きます。
任意のコードエディタを使用してローカルコンピュータで開発できます。
Repl.it (https://repl.it) などのWebブラウザで使用できるオンラインIDEを利用してもできます。
ローカルで実行する場合、node.jsとDiscord API が必ずインストールされることを確認する。

```
npm init
npm i discord.js
```

以下のソースコードをindex.jsにコピペしましょう。
このコードで、AutoReplyの機能のみ入っています。

```js
const { token } = require('./config.json');
const { Client, GatewayIntentBits } = require('discord.js');

const client = new Client({ intents: [
    GatewayIntentBits.Guilds,
    GatewayIntentBits.GuildMessages,
    GatewayIntentBits.GuildVoiceStates,
    GatewayIntentBits.MessageContent
] });

client.once('ready', () => onClientReady());

// Standby, status-related function
function onClientReady() {
    // Bot online log
    console.log("Pienmaru is ready!");

    // Listen to Messages in the channel
    client.on('messageCreate', (message) => onMessageReceived(message));
}

// Message-handling function
function onMessageReceived(msg) {
    // Triggered if a message contains ONLY "pien", and reply them
    if (msg.content === "pien") {
        msg.reply("pien 🥺");
    }
})

client.login(token)
```
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊     **UPDATE**     ＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
discord.js v.14 にて、intents の呼び出しに更新があります。2022/09 時点では以下のソースコードだと動いてると確認しました。
```js
const { token } = require('./config.json');
const { Client, GatewayIntentBits } = require('discord.js');

const client = new Client({ intents: [
    GatewayIntentBits.Guilds, 
    GatewayIntentBits.GuildMessages,
    GatewayIntentBits.MessageContent
] });

client.once('ready', () => onClientReady());
function onClientReady() {
    console.log("Pienmaru is ready!");
    client.on('messageCreate', (message) => onMessageReceived(message));
}

function onMessageReceived(message) {
    if (message.content.toLowerCase() === "pien") {
        message.reply("pien 🥺");
    }
}

client.login(token);
```


上記のステップでボットを作成したときに、コピーしたトークンを .envファイル などの環境変数の宣言に使用されます。
私の場合は、config.json 使います。
フォルダ内に新規ファイルのconfig.jsonを作成、以下の内容を入れます。
```
{
    "token": [paste token here]
}
```

Repl.itであれば、作成したほとんどのファイルは誰にでも表示されますが、.envファイルは自分だけに表示されます。 public replでも、自分以外には .envファイルの中身を表示できません。

ローカルで実行する場合、```node index.js ```　などで実行したら、ボットがオンライン状態になります。オンラインIDEを利用する場合、ブラウザーのタブが開いている限りボットがオンライン状態になります。

|　　　　　　　　  　　　　　　　　   　Pienmaru 営業中！　　　　　　　　　　　　　　　　　　　　|
|:-:|
|![zpic8.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/1c2800eb-6715-9c6d-4365-95f508486df1.png)|


## アイディア参考
暇つぶしとして、自分のボットをたまたま機能をアップグレードしています。
|　　　　　　　　  　　　　　　　　　現在の機能一覧：　　　　　　　　　　　　  　　　　　　　　  　　　　|
|:-:|
■ AutoReply+ (指定されたメッセージ内容を、言葉リスト一覧からランダムで選んで返信する)
![zpic9a.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/547a3207-68ec-ff81-9404-4db435f7a889.png)
■ AutoReact (指定されたメッセージ内容に、指定されたリアクションをつける)
![zpic9b.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/2c035e07-5b27-6b55-a066-c92809857aff.png)
■ Math.jsを入れて、計算コマンド (/pn calc [・・・]) で電卓としても使える（ぴえん顔で計算して返信するのは個人的にかわいいと思います(´▽｀*)♡）
![zpic9.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724319/cf01f652-b5bd-1c4b-9b8c-080fadb98a24.png)

|　　　　　　　　　　   基本ソースコード(勉強用)：　　　　　　　　　　　　　|
|:-:|
https://github.com/annKurihara/pienmaru-basic-kit

|　　　　　　　現行のぴえん丸(スラッシュコマンド対応)：　　　　　　　|
|:-:|
https://github.com/annKurihara/pienmaru-kai