在 Express 上使用 discrod.js 來建置 Discord 機器人(Discord Bot)

前言

本文介紹在 Node Express 上透過 discord.js，
來讓 Discord Bot 上線，
並處理 User 在 Channel 跟 Bot 對話，
或 User 直接跟 Bot 對話(非 Channel) 的訊息處理。
例如，Bot 發送訊息到 Channel 、發送訊息給 User 或是針對訊息回覆(reply)。

實作

建立 Discord Bot

1.建立 Application (Bot)
到 Discord Developer Portal - Applications 建立 Application (就是 Bot)。

2.設定 Application 基本資料
在「General Information」Tab 設定 App Icon, Name, Description 及 Tags …等資料

3.設定 OAuth2 -> URL Generator
在「OAuth2 -> URL Generator」設定將 Bot 加到 Discord 伺服器的權限 URL，
在「SCOPES」需要 bot，「BOT PERMISSIONS」需要Send Messages，
移到最下面，將「GENERATED URL」內容 Copy 下來，
在 Browser 上開啟新的 Tab ，並貼上剛才 Copy 的 URL，

將 Bot 加到某伺服器之中(如果選不到伺服器，請先新增伺服器)。

授與 Bot 權限

最後成功將 Bot 加到 伺服器 之中，

在 伺服器 中，會顯示 bot3 出現的訊息，但目前為 離線 狀態。

4.Copy Bot Token
切回到 Bot 設定的頁面，切到 「Bot」 Tab，
按下 Reset Token，並將 Token Copy 下來，

5.設定 Privileged Gateway Intents
因為要讀取使用者的訊息，所以需要啟用MESSAGE CONTENT INTENT，

建立 Node 程式來處理 Bot

1.建立 Node 程式並加入套件

1
2
3
4
mkdir bot3
cd bot3
npm init -y
npm install express dotenv discord.js

在 package.json中加入 "type": "module"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
{
  "name": "bot3",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "Rainmaker Ho",
  "license": "ISC",
  "dependencies": {
    "discord.js": "^14.12.1",
    "dotenv": "^16.3.1",
    "express": "^4.18.2"
  },
  "type": "module"
}
  • 註: discord.js v14 需要 Node 版本在 16.11.0 以上哦~

2.設定 Bot Token 到 .env 中
加入 .evn檔案，並加入 Bot Token 設定，如下，

1
DISCORD_TOKEN=剛才Copy的Token

3.新增 app.js 來處理 User 與 Bot 的訊息溝通
3.1.建立 express 網站
建立簡單的 Express 網站，並設定全域的bot做為存放 Discord 的變數

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
import { Client, Events, GatewayIntentBits, Partials } from "discord.js";
import express from "express";
import dotenv from "dotenv";
dotenv.config();

const app = express();
const port = 3000;
let bot = {};

app.all("/", (req, res) => {
  res.send("Hello Discord Bot, Use Discord.js");
});

app.listen(port, () => {
  console.log(`app listening on port ${port}`);
});

執行node app.js，開啟 Browser，URL 輸入http://localhost:3000/,
可以看到 Hello Discord Bot, Use Discord.js，就表示 Express 運作沒問題。

3.2.連線/啟動 Discord Bot，並處理訊息
建立 StartDiscordBots function ，建立 Client物件來處理 Discord Bot 的訊息事件，
並設定/startRoute，執行StartDiscordBots，如下，

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
import { Client, Events, GatewayIntentBits, Partials } from "discord.js";
import express from "express";
import dotenv from "dotenv";
dotenv.config();

const app = express();
const port = 3000;
let bot = {};

app.all("/", (req, res) => {
  res.send("Hello Discord Bot, Use Discord.js");
});

app.get("/start", (req, res) => {
  console.log(`Bot Start ....`);
  if (!bot.client) {
    StartDiscordBots();
  }
  res.send("已啟動 Bot");
  console.log(`Bot End ....`);
});

app.listen(port, () => {
  console.log(`app listening on port ${port}`);
});

const StartDiscordBots = () => {
  const client = new Client({
    intents: [
      GatewayIntentBits.Guilds,
      GatewayIntentBits.GuildMessages,
      GatewayIntentBits.MessageContent,
      GatewayIntentBits.DirectMessages,
    ],
    partials: [Partials.Channel, Partials.Message],
  });
  bot = {
    id: "Bot3",
    token: process.env.DISCORD_TOKEN,
    client: client,
  };
  client.on(Events.ClientReady, () => {
    console.log(`${bot.id}: Ready ${client.user.tag}!`);
  });

  client.on(Events.MessageCreate, (msg) => {
    //不處理 bot 發送的訊息
    if (msg.author.bot) return;
    const content = `input:${msg.content}, msgId:${msg.id}, channelId:${msg.channelId}`;
    if (msg.guild) {
      //channel 中
      console.log("Channel中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 channel
      msg.channel.send(`echo:${content}`);
    } else {
      //user對bot
      console.log("DM中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 user
      const userId = msg.author.id;
      bot.client.users.cache.get(userId).send(`echo:${content}`);
    }
  });
  client.login(bot.token).then(() => {
    console.log(
      `Discord Bot Login User:${client.user.id}:${client.user.displayName}`
    );
  });
};

執行node app.js，開啟 Browser，URL 輸入http://localhost:3000/start,
可以看到 已啟動 Bot。
切到 Discord 頁面，可以發現這時，Bot3已經上線了哦~

在 Channel 對話中輸入 Hello Bot3，
則可以看到 Bot 會回 2 個訊息，
一個是針對原訊息回覆(Reply), 一個是在 Chanel 中發送訊息(Send)，

直接跟 Bot3 對話，輸入 Bot3 DM後，
可以看到 Bot 也是會回 2 個訊息，
一個是針對原訊息回覆(Reply), 一個是送訊息給 User(Send)，

3.3.發送訊息到 Channel
上述是針對 User 發的訊息處理，如果是要由 Bot 發送訊息給 Channel，
需要有ChannelId，ChannelId可以從 Discord 的 URL 中取出來，
例如，https://discord.com/channels/guildId/channelId
所以在 app.js 加入Send2Channel function 來處理將訊息送到 Channel 之中。
設定 /sendC Route 取得 QueryString 後，呼叫 Send2Channel，如下，

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
import { Client, Events, GatewayIntentBits, Partials } from "discord.js";
import express from "express";
import dotenv from "dotenv";
dotenv.config();

const app = express();
const port = 3000;
let bot = {};

app.all("/", (req, res) => {
  res.send("Hello Discord Bot, Use Discord.js");
});

app.get("/start", (req, res) => {
  console.log(`Bot Start ....`);
  if (!bot.client) {
    StartDiscordBots();
  }
  res.send("已啟動 Bot");
  console.log(`Bot End ....`);
});

app.get("/sendC", async (req, res) => {
  const channelId = req.query.cid;
  const msg = "Hello /SendC";
  await Send2Channel(channelId, msg);
  res.send("sendC ....");
  console.log("sendC");
});

app.listen(port, () => {
  console.log(`app listening on port ${port}`);
});

const StartDiscordBots = () => {
  const client = new Client({
    intents: [
      GatewayIntentBits.Guilds,
      GatewayIntentBits.GuildMessages,
      GatewayIntentBits.MessageContent,
      GatewayIntentBits.DirectMessages,
    ],
    partials: [Partials.Channel, Partials.Message],
  });
  bot = {
    id: "Bot3",
    token: process.env.DISCORD_TOKEN,
    client: client,
  };
  client.on(Events.ClientReady, () => {
    console.log(`${bot.id}: Ready ${client.user.tag}!`);
  });

  client.on(Events.MessageCreate, (msg) => {
    //不處理 bot 發送的訊息
    if (msg.author.bot) return;
    const content = `input:${msg.content}, msgId:${msg.id}, channelId:${msg.channelId}`;
    if (msg.guild) {
      //channel 中
      console.log("Channel中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 channel
      msg.channel.send(`echo:${content}`);
    } else {
      //user對bot
      console.log("DM中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 user
      const userId = msg.author.id;
      bot.client.users.cache.get(userId).send(`echo:${content}`);
    }
  });
  client.login(bot.token).then(() => {
    console.log(
      `Discord Bot Login User:${client.user.id}:${client.user.displayName}`
    );
  });
};

const Send2Channel = async (channelId, msg) => {
  const client = bot.client;
  let channel = client.channels.cache.get(channelId);
  if (!channel) {
    channel = await client.channels.fetch(channelId);
  }
  channel.send(`${channelId}:${msg}`);
};

重新執行 app.js，開啟 Browser ，先連到 http://localhost:3000/start，
再將 URL 改成 http://localhost:3000/sendC?cid=Discord中的ChannelId，
就可以發現 Bot 發送 Hello /SendC 的訊息，

3.4.發送訊息給 User
發送訊息給 User 需要 UserId ，可以從收到的 Message 來取得，
例如，msg.author.id
所以在 app.js 加入Send2User function 來處理將訊息送給 User 之。
設定 /sendU Route 取得 QueryString 後，呼叫 Send2User，如下，

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
import { Client, Events, GatewayIntentBits, Partials } from "discord.js";
import express from "express";
import dotenv from "dotenv";
dotenv.config();

const app = express();
const port = 3000;
let bot = {};

app.all("/", (req, res) => {
  res.send("Hello Discord Bot, Use Discord.js");
});

app.get("/start", (req, res) => {
  console.log(`Bot Start ....`);
  if (!bot.client) {
    StartDiscordBots();
  }
  res.send("已啟動 Bot");
  console.log(`Bot End ....`);
});

app.get("/sendC", async (req, res) => {
  const channelId = req.query.cid;
  const msg = "Hello /SendC";
  await Send2Channel(channelId, msg);
  res.send("sendC ....");
  console.log("sendC");
});

app.get("/sendU", async (req, res) => {
  const userId = req.query.uid;
  const msg = "Hello /sendU";
  await Send2User(userId, msg);
  res.send("sendU ....");
  console.log("sendU");
});

app.listen(port, () => {
  console.log(`app listening on port ${port}`);
});

const StartDiscordBots = () => {
  const client = new Client({
    intents: [
      GatewayIntentBits.Guilds,
      GatewayIntentBits.GuildMessages,
      GatewayIntentBits.MessageContent,
      GatewayIntentBits.DirectMessages,
    ],
    partials: [Partials.Channel, Partials.Message],
  });
  bot = {
    id: "Bot3",
    token: process.env.DISCORD_TOKEN,
    client: client,
  };
  client.on(Events.ClientReady, () => {
    console.log(`${bot.id}: Ready ${client.user.tag}!`);
  });

  client.on(Events.MessageCreate, (msg) => {
    //不處理 bot 發送的訊息
    if (msg.author.bot) return;
    const content = `input:${msg.content}, msgId:${msg.id}, channelId:${msg.channelId}`;
    if (msg.guild) {
      //channel 中
      console.log("Channel中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 channel
      msg.channel.send(`echo:${content}`);
    } else {
      //user對bot
      console.log("DM中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 user
      const userId = msg.author.id;
      bot.client.users.cache.get(userId).send(`echo:${content}`);
    }
  });
  client.login(bot.token).then(() => {
    console.log(
      `Discord Bot Login User:${client.user.id}:${client.user.displayName}`
    );
  });
};

const Send2Channel = async (channelId, msg) => {
  const client = bot.client;
  let channel = client.channels.cache.get(channelId);
  if (!channel) {
    channel = await client.channels.fetch(channelId);
  }
  channel.send(`${channelId}:${msg}`);
};

const Send2User = async (userId, msg) => {
  const client = bot.client;
  let clientUser = client.users.cache.get(userId);
  if (!clientUser) {
    clientUser = await client.users.fetch(userId);
  }
  clientUser.send(`${userId}:${msg}`);
};

重新執行 app.js，開啟 Browser ，先連到 http://localhost:3000/start，
再將 URL 改成 http://localhost:3000/sendU?uid=userId，
就可以發現 Bot 發送 Hello /sendU 的訊息，

3.5.回覆某訊息
要針對某個訊息來「回覆」，需要那個訊息的Channeld及MessageId，
所以在Events.MessageCreate事件中，
就有將訊息的Channeld及MessageId一併顯示出來，
所以在 app.js 加入Reply2Msg function 來處理針對某訊息(channelId, msgId)回覆。
設定 /reply Route 取得 QueryString(cid, mid) 後，呼叫 Reply2Msg，如下，

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
import { Client, Events, GatewayIntentBits, Partials } from "discord.js";
import express from "express";
import dotenv from "dotenv";
dotenv.config();

const app = express();
const port = 3000;
let bot = {};

app.all("/", (req, res) => {
  res.send("Hello Discord Bot, Use Discord.js");
});

app.get("/start", (req, res) => {
  console.log(`Bot Start ....`);
  if (!bot.client) {
    StartDiscordBots();
  }
  res.send("已啟動 Bot");
  console.log(`Bot End ....`);
});

app.get("/sendC", async (req, res) => {
  const channelId = req.query.cid;
  const msg = "Hello /SendC";
  await Send2Channel(channelId, msg);
  res.send("sendC ....");
  console.log("sendC");
});

app.get("/sendU", async (req, res) => {
  const userId = req.query.uid;
  const msg = "Hello /sendU";
  await Send2User(userId, msg);
  res.send("sendU ....");
  console.log("sendU");
});

app.get("/reply", async (req, res) => {
  const channelId = req.query.cid;
  const msgId = req.query.mid;
  const msg = "Hello /reply";
  await Reply2Msg(channelId, msgId, msg);
  res.send("reply ....");
  console.log("call Reply2Msg");
});

app.listen(port, () => {
  console.log(`app listening on port ${port}`);
});

const StartDiscordBots = () => {
  const client = new Client({
    intents: [
      GatewayIntentBits.Guilds,
      GatewayIntentBits.GuildMessages,
      GatewayIntentBits.MessageContent,
      GatewayIntentBits.DirectMessages,
    ],
    partials: [Partials.Channel, Partials.Message],
  });
  bot = {
    id: "Bot3",
    token: process.env.DISCORD_TOKEN,
    client: client,
  };
  client.on(Events.ClientReady, () => {
    console.log(`${bot.id}: Ready ${client.user.tag}!`);
  });

  client.on(Events.MessageCreate, (msg) => {
    //不處理 bot 發送的訊息
    if (msg.author.bot) return;
    const content = `input:${msg.content}, msgId:${msg.id}, channelId:${msg.channelId}`;
    if (msg.guild) {
      //channel 中
      console.log("Channel中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 channel
      msg.channel.send(`echo:${content}`);
    } else {
      //user對bot
      console.log("DM中=>>>", msg);
      //reply
      msg.reply(`echo:${content}`);
      //send 2 user
      const userId = msg.author.id;
      bot.client.users.cache.get(userId).send(`echo:${content}`);
    }
  });
  client.login(bot.token).then(() => {
    console.log(
      `Discord Bot Login User:${client.user.id}:${client.user.displayName}`
    );
  });
};

const Send2Channel = async (channelId, msg) => {
  const client = bot.client;
  let channel = client.channels.cache.get(channelId);
  if (!channel) {
    channel = await client.channels.fetch(channelId);
  }
  channel.send(`${channelId}:${msg}`);
};

const Send2User = async (userId, msg) => {
  const client = bot.client;
  let clientUser = client.users.cache.get(userId);
  if (!clientUser) {
    clientUser = await client.users.fetch(userId);
  }
  clientUser.send(`${userId}:${msg}`);
};

const Reply2Msg = async (channelId, msgId, msg) => {
  const client = bot.client;
  let channel = client.channels.cache.get(channelId);
  if (!channel) {
    channel = await client.channels.fetch(channelId);
  }
  let message = channel.messages.cache.get(msgId);
  if (!message) {
    message = await channel.messages.fetch(msgId);
  }
  const content = `Reply2Msg:cId:${channelId}, mId:${msgId}, ${msg}`;
  message.reply(content);
};

重新執行 app.js，開啟 Browser ，先連到 http://localhost:3000/start，
再將 URL 改成 http://localhost:3000/reply?mid=訊息中的msgId&cid=訊息中的channelId，
就可以發現 Bot 針對那個訊息發送 Reply2Msg:...Hello /reply 的訊息，

  • 註: 上面使用 Discord.js 取物件時，大多會使用 cache.get，如果取不到，就用 fetch

參考資源

Discord Developer Portal - Applications
discord.js

tag:

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录（注意不是yilia根目录）执行以下命令：
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置： 

      jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

大家好，我是亂馬客 Rainmaker，目前任職於叡揚資訊，大家也都叫我 RM 。 平常負責開發公司各產品線的加值、共用的軟體，例如 Azure, OpenAI, Chatbot, Database ... 同時 Support 公司各種技術及資安修改問題。 Blog中的內容也是個人的看法， 如果有需要討論的地方， 可以留言，或是 mail 給我 :) rainmaker_ho@gss.com.tw