前回 はこちらのタイミングで定型文を送信するLINE BOTをつくりました。
今回は、Node.jsを使って、定型文を返信するLINE Botを作成します。
途中までは、前回の記事 と全く一緒です。
共通の準備（前回と一緒なのでスキップ可能）
❶ Developerアカウントを作成する
https://developers.line.biz/ja/ からアカウントを作成します。
既にアカウントを持っている方はスキップしてください。
詳しくは こちら。
❷ プロバイダーを作成する
https://developers.line.biz/console/ にログインして、プロバイダーの作成ボタンを押下し、プロバイダーを作成します。
既にプロバイダーを持っている方はそちらを使用しても大丈夫です。
詳しくは こちら。
❸ チャンネルを作成する
❷で作成したプロバイダから、新規チャンネルを作成します。
今回はLINE BOTをつくるためのチャンネルなので、Messaging APIを選択します。
必須項目をすべて埋めて、Messaging APIを作成しましょう。
詳しくは こちら。
❹ チャネルシークレットをメモする
「チャネル基本設定」から「チャネルシークレット」をメモします。あとで使います。
❺ チャネルアクセストークンを発行しメモする
❸で作成したチャンネルの「Messaging API設定から」から「チャンネルアクセストークン」の「発行ボタン」を押下し、チャンネルアクセストークンをメモします。あとで使います。
詳しくは こちら。
❻ Botと友達になる
「Messaging API設定」のQRコードを読み込み、友達になります。
今回用の準備
❶ Ngrokのアカウントを作成しauthtokenをメモする（任意）
LINE BOTがメッセージを受け取った際の処理を書くには、WebHookを使ってイベントを受け取る必要があります。
イベントを受け取るボットサーバーは、グローバルに公開されている必要があるため、開発中はNgrokなどのツールを使ってローカルに立てたサーバをグローバルに公開すると、挙動確認のために何度もデプロイしなくて済むので便利です。
Ngrokはエングロックと読みます。Nginx（エンジンエックス）と、ほぼ同じ法則の読み方ですね。
アカウントを作成したら、 https://dashboard.ngrok.com/get-started/your-authtoken からauthtokenを確認し、メモしておきましょう。
Ngrokはダウンロードして、グローバルにインストールしても良いのですが、僕はいつもnpmでローカルにインストールして使っています。
実装
❶ コードを書く
.env
CHANNEL_SECRET=共通の準備❹でメモしたチャネルシークレットを記載 CHANNEL_TOKEN=共通の準備❺でメモしたチャネルアクセストークンを記載 NGROK_AUTH_TOKEN=今回用の準備❶でメモしたオーストークンを記載
package.json
{
"scripts": {
"upgrade:ngrok": "ngrok config upgrade"
},
"dependencies": {
"@line/bot-sdk": "^8.0.1",
"dotenv": "^16.3.1",
"express": "^4.18.2"
},
"devDependencies": {
"ngrok": "^5.0.0-beta.2"
}
}
index.js
'use strict'; require('dotenv').config(); const ngrok = require('ngrok'); const express = require('express'); const line = require('@line/bot-sdk'); // チャネルシークレットとチャネルアクセストークンを読み込む const { CHANNEL_SECRET, CHANNEL_TOKEN, NGROK_AUTH_TOKEN } = process.env; // 将来を見据えて.envでポートを指定できるようにしておくが、今回は未指定なので3000となる const PORT = process.env.PORT || 3000; const config = { channelSecret: CHANNEL_SECRET, channelAccessToken: CHANNEL_TOKEN }; const client = new line.Client(config); async function handleLineWebHook(event) { return client.replyMessage(event.replyToken, { type: 'text', text: 'Hello World.' // 返信内容 }); } const app = express(); // middlewareを読み込む位置に注意が必要 // https://line.github.io/line-bot-sdk-nodejs/guide/webhook.html app.use('/webhook', line.middleware(config)); app.post('/webhook', (req, res) => { if (req.body.events.length === 0) { res.sendStatus(200); return; } Promise.all(req.body.events.map(handleLineWebHook)).then((result) => { return res.json(result); }); }); app.listen(PORT); (async () => { const url = await ngrok.connect({ addr: PORT, authtoken: NGROK_AUTH_TOKEN }); console.log(`BOT_SERVER_URL: ${ url }`); })();
コード内のコメントにも書きますが、ミドルウェアを読み込む場所を間違えると動きません。
昔は、
app.post('/webhook', line.middleware(config), (req, res) => { if (req.body.events.length === 0) { res.sendStatus(200); return; } Promise.all(req.body.events.map(handleLineWebHook)).then((result) => { return res.json(result); }); });
で、動いたような気がするのですが、これだと動かなくなってました。
❷ コードを実行する
初回のみ、
npm install
と、
npm run upgrade:ngrok
が必要です。
npm install は必要なライブラリのインストール。
npm run upgrade:ngrok はngrok.ymlの作成を行います。
それ以降は、
node index.js
でOKです。
実行すると、ターミナルに、
BOT_SERVER_URL: https://HOGEHOGE.ngrok-free.app/webhook
と、Ngrokの力で世に公開されたURLが表示されるのでメモしておきます。
このURLは、実行する度、毎回変わります。
❸ WebHookのURLを設定する
LINE Developers にログインし、チャンネルの「Messaging API設定 > Webhook設定 > Webhook URL」から、WebHookのURLを設定します。
WebHookのURLは❷でメモしたURLです。
URLを入力したら、「検証」を押下してみましょう。
うまくいっていれば、「成功」と表示されます。
成功したら、「Messaging API設定 > Webhook設定 > Webhookの利用」をONにします。
❹ LINE BOTの設定を変更する
実は、LINE BOTには標準で自動返信機能が備わっており、これをOFFにしないとWebHookとバッティングするのでOFFにします。
「Messaging API設定 > Webhook設定 > LINE公式アカウント機能 > 応答メッセージ」の編集を押下し、「Webhook」をONに、「応答メッセージ」をOFFにします。
❺ メッセージを送信してみる
これで、すべての設定が完了です。
試しにLINE BOTに何かメッセージを送信してみましょう。
なにを送信しても、即レスで「Hello World.」と返してくれるはずです。
リポジトリは こちら です。
追記
無料プラン（コミュニケーションプラン）では、無料メッセージ通数が月間200通です。
上限に達すると、プランを変更しない限り追加メッセージも送信できなくなります。
また、メッセージ通数は送付人数 × メッセージ通数でカウントされます。
