LoginSignup
4
5

More than 5 years have passed since last update.

Facebook Messenger Bot を Hubot で構築して Heroku で動かす

Last updated at Posted at 2016-08-24

予め

  1. Heroku のアカウントがあって、heroku toolbelt が ローカルにインストールされている
  2. nodejs が インストールされている
  3. Facebook の Page が作られている(https://www.facebook.com/pages/create/)
  4. Facebook アプリが作成されている(https://developers.facebook.com/quickstarts/?platform=web)

開発環境作り

Hubot のインストール

$ npm install -g yo generator-hubot

Hubot application の Generate

yeomen generator を 使ってアプリケーションのベースを作ります
Messenger Bot 用の Adapter には messenger-bot を使います

かりに アプリケーション名を botapp とします

$ mkdir botapp
$ cd botapp
$ yo hubot

git に Commit しておく

$ git init
$ git add .
$ git commit -m 'Initial commit'

adapter を聞かれたら、 messenger-bot と入力する

Facebook access token を作る

  1. アプリケーションの管理ページから Messenger を選択する
  2. 登録した Messenger Bot 用の アプリケーションを選択
  3. Token が表示される

FBAPP.jpg

Heroku に Push

Heroku の git に Push する

$ heroku apps:create botapp
$ git push heroku master

Token とか 登録する

$ heroku config:set MESSENGER_ACCESS_TOKEN=(先ほど取得した Token)
$ heroku config:set MESSENGER_VERIFY_TOKEN=botapp (何か適当な文字列 Webhooks 登録時に使用します)
$ heroku config:set HUBOT_HEROKU_KEEPALIVE_URL=$(heroku apps:info -s  | grep web-url | cut -d= -f2)

Webfook を登録

  1. Tokenを取得した Facebook のアプリケーション管理ページで Webhooks の欄の Edit Events ボタンをくりく
  2. 下のダイアログが表示されるので、コールバックURLへ (herokunourl)/webhook/、トークン確認へ MESSENGER_VERIFY_TOKEN へ設定した文字列を入力する
  3. チェックボックスを全部チェックして 確認して保存 する

webhook.jpg

これで準備完了です

簡単な Coll and Response

Hubot の応答Scriptを書く

1.script フォルダ内に以下のファイルを設定

botapp.coffee
#commands:
# hubot こんちは return the message ちはこん
#
module.exports = (robot) ->
  robot.hear /こんちは/i, (res) ->
    res.send 'ちはこん'

2.heroku に Push する
3.facebook の Page から メッセンジャーを起動してメッセージを入力する

kontiha.jpg

これで、返事が帰ってくるはずです

4
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
5