discord bot 作成 (discord.js)  2024/11版

discordのボットを作ってみました。
記事の時期のよって、古い情報もあり動かないところもあったので、2024/11現在ってことで、実際に作ってみて、整理してみました。


## 使ったもの
* 自分のパソコン（Mac）のnode.js
* discord.js

## 必要な知識
* 多少のnode.js javascriptのスキル
* コピペ能力

## 作るBOT
問題がネタが思いつかないことなのですが、天気を教えてくれるボットにしました。
https://qiita.com/youtoy/items/932bc48b03ced5a45c71
をコードをそのまんま使わせていただきました。
ありがとうございます。
ついでに、「天気」以外のメッセージには「👍️」マークをリアクションするようにしてみました。

## discord bot 設定
https://discord.com/developers/applications
で、アプリ設定画面に行きます。
スクショがないです。
※操作中に、適宜「保存」してくださいね。
 - - -
 1. 右上の``[New Application]``ボタンを押します 
 1. ``Name`` は何でもいいですが、今回は「``Tenki_and LikeMark``」にしました
 1. 左側のメニューで「``Bot``」を選びます
 1. なんでもいいですが、今回は、``Username``に「東京の天気👍️」にします
 1. すぐ下の「``TOKEN``」ところで、``[Reset TOKEN]``ボタンを押してTOKENを発行し、メモ帳にコピります
 1. おまけで、アイコンとかをいい感じに設定してもOKです（自分はいらすとやさんの天気イラストを貼り付けました☀️）
 1. そして、「``Privileged Gateway Intents``」のところまで行き、とりあえず全部ONにします（実験くんなので・・）。　でも、今回は「``Message Content Intent``」がONになっていればいいはず
 1. 保存したら、左側のメニューで「``Installation``」を選びます
 1. 「``Default Install Settings``」のところに行き、「``Guild Install``」「``SCOPES``」で「``Bot``」を追加します
 1. 「``PERMISSIONS``」が出てくるので、今回は、「``Read Message History``」と「``Send Message``」を追加します
 1. 同じページに「``Install Link``」があるので、メモ帳にコピります
- - -
こんなところかな・・
漏れてたらごめんなさい・・

## node.jsのインストール
入っている人は飛ばしてください。
Macのbrewでインストールしたときの例です。他の環境も含め正確にはググって入れてください。

たぶん、こんな感じ↓
```
% brew install nodebrew
% /opt/homebrew/opt/nodebrew/bin/nodebrew setup_dirs
% echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.zprofile
% nodebrew -v
% nodebrew ls-remote
% nodebrew install-binary latest
% nodebrew ls
% nodebrew use v23.1.0
```

動いているか確認↓
```
% node -v
% npm -v
```

## 開発

#### 適当なフォルダを作る
```
% mkdir ~/prg/discord-bot/tenki_likemark
% cd ~/prg/discord-bot/tenki_likemark
```

#### 環境設定
```
% npm init
% npm install discord.js
% npm install axios
```
package.jsonが作成され、discord.js、 axiosがインストールされます。

#### index.js にコード記載
「天気」と投稿すると、東京の天気が表示され、それ以外には、「🤔」がリアクションされるようにしましました。

```
const { Client, GatewayIntentBits } = require('discord.js');
const { token } = require('./config.json');
const client = new Client({
		intents: [
			GatewayIntentBits.Guilds,
			GatewayIntentBits.GuildMessages,
			GatewayIntentBits.MessageContent
		]
});
const axios = require("axios");

const url = "https://www.jma.go.jp/bosai/forecast/data/forecast/";
const area = "130000"; // 東京
var tenki = "";

client.once('ready', async() => {
		console.log(`${client.user.tag}で起動しました！`);
});

client.on('messageCreate', message => {
		if (message.author.bot) {
			return;
		}
		if (message.content == '天気') {
			(async function getWeatherForecast() {
				try {
					const response = await axios.get(`${url}${area}.json`);
					for(const area of response.data[0].timeSeries[0].areas) {
						mes = `----${area.area.name}----\n`
						message.channel.send(mes);
						for(const weather of area.weathers) {
								mes = weather + '\n';
								message.channel.send(mes);
						}
					}
				}
				catch (error) {
					console.log("error");
				}
			})();
		}
		else {
			message.react('🤔');
		}
});

client.login(token);
```

#### config.json の記載
さっき、取得した``TOKEN``を``config.json``に埋め込みます。

```
{
    "token": "＊＊＊＊取得したトークン文字列＊＊＊＊"
}
```

#### さぁ、起動

```
% node index.js
東京の天気👍#xxxxで起動しました！
```

## discord にインストール
さっき控えた「``Install Link``」で、とサーバに登録します。

```
https://discord.com/oauth2/authorize?client_id=ほげほげhogehogeほげほげ
```

## お試し実行
![スクリーンショット 2024-11-05 15.36.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/186659/50ccd196-d74e-3571-9d42-4e8cd91bf9e1.png)

### node.js はつけっぱなし？？
常駐化させる方法は、ググってください。
でも、ローカルのMacで常駐させたくないので、次の投稿で、Googleの無料サーバに切り替えます。

## 完成
めでたしめでたし。