しふみんのブログ

しふみんのブログです。

Heroku+RailsでLine botを作る 第10回 ローカル開発環境での動作確認

前回までのあらすじ

第1回: http://shifumin.hatenablog.com/entry/2018/04/20/000500
第2回: http://shifumin.hatenablog.com/entry/2018/04/22/002000
第3回: http://shifumin.hatenablog.com/entry/2018/04/23/000500
第4回: http://shifumin.hatenablog.com/entry/2018/04/24/000500
第5回: http://shifumin.hatenablog.com/entry/2018/04/25/000500
第6回: http://shifumin.hatenablog.com/entry/2018/04/26/000500
第7回: http://shifumin.hatenablog.com/entry/2018/04/27/000500
第8回: http://shifumin.hatenablog.com/entry/2018/04/29/000500
第9回: shifumin.hatenablog.com

公式サンプルコードのオウム返しbotRailsへ実装(移植)しました。
またそのRailsアプリをHerokuへとデプロイし動作することを確認しました(第一部完)
今回はローカル開発環境での動作確認をやっていきたいと思います。

ngrok

ローカル開発環境での動作確認はngrokというツールを使います。
このツールを使うとローカル開発環境で動かしているサーバに対してパブリックなURLを割り当てることができます。
詳しくは下記をご参照ください。

ngrok.com qiita.com

LINE bot開発だと、そのURLをbotのチャンネル設定の「Webhook URL」に設定することによっていちいちHerokuにデプロイしなくても修正したコードの動作確認を行えるようになります。
便利ですね。

Homebrew-Cask

ngrokは公式の通りにインストールしてもいいのですが、面倒なのでHomebrew-Caskを使ってインストールしましょう。
Homebrew-Caskについては詳しくは下記をご参照ください(投げ)
簡単にいうと、macOSアプリケーションについてのHomebrewです。

参考: Homebrew-Cask

Homebrew-Caskを利用するためにHomebrewでtapします。

brew tap caskroom/cask

これでHomebrew-Caskを利用できるようになったのでngrokをインストールします。

brew cask install ngrok

direnv

前回の記事でRailsアプリを動かすために LINE_CHANNEL_SECRETLINE_CHANNEL_TOKEN環境変数をHerokuにセットしました。
同様に、ローカル開発環境でも動かすために同じ環境変数をセットする必要があります。

ローカル開発環境の環境変数のセットには direnv を使いましょう。
direnvについては詳しくは下記をご参照ください。

github.com qiita.com

Rails 環境変数」の文脈だとdotenvが有名な気がしますが、僕はdirenvの方が好きなのでこの連載ではdirenvを使います。
direnvの方が好きな理由は、下記のリンク先の記事にもありますが、dotenvだとアプリ内に明示的にdotenvのロードを記述する必要があるからです。
direnvはそれをする必要がありません(最初にシェルに設定を書く必要がありますが)

参考: DotenvではなくDirenvを使う | SOTA

それではHomebrewでdirenvをインストールしましょう。

brew install direnv

次にシェルに設定を記述します。
下記はシェルがbashの場合です。
他のシェルをお使いの方はよしなにやってください。

echo 'eval "$(direnv hook bash)"' >> ~/.bash_profile

初期設定が完了したので環境変数を設定していきます。
公式的には direnv edit ですが、各種エディタでプロジェクトディレクトリのルートに .envrc を作成すれば大丈夫なはずです。

direnv edit . # path/to/your-project/.envrc をエディタで作成/編集する

必要な環境変数LINE_CHANNEL_SECRETLINE_CHANNEL_TOKEN の2つなので、 .envrc には下記の2行を書きます。

export LINE_CHANNEL_SECRET=<your_line_channel_secret>
export LINE_CHANNEL_TOKEN=<your_channel_token>

あとはdirenvが自動で環境変数を設定してくれるはずですが、読み込まれていなかったりエラーが発生した場合は direnv allow すればいいようです。

dieenv allow

試しにそれぞれの環境変数が設定されていることを確認してみましょう。

echo $LINE_CHANNEL_SECRET
<設定したLINE_CHANNEL_SECRETが出力される>
echo $LINE_CHANNEL_TOKEN
<設定したLINE_CHANNEL_TOKENが出力される>

ちゃんと環境変数が設定されているようです。

ローカル開発環境での動作確認

ここまででローカル開発環境で動作確認を行う準備が整いました。
なので、実際に動作確認を行なっていきましょう。
PostgreSQLサーバは起動しているものとします。
起動していない場合は下記のコマンドでPostgreSQLサーバを起動させます。

brew services start postgresql # 停止コマンドは brew services stop postgresql

続いて、Railsサーバを起動させます。

bin/rails s # あるいは bundle exec rails s

Railsサーバを起動させた状態でターミナルの別ウィンドウを開くなどして別のコマンドライン上でngrokを起動させます。

ngrok http 3000 # 停止は Ctrl + C

表示が切り替わり、例えば下記のような出力となるはずです。

ngrok by @inconshreveable

Session Status                online
Session Expires               7 hours, 59 minutes
Version                       2.2.8
Region                        United States (us)
Web Interface                 http://127.0.0.1:4040
Forwarding                    http://cb413e80.ngrok.io -> localhost:3000
Forwarding                    https://cb413e80.ngrok.io -> localhost:3000

Connections                   ttl     opn     rt1     rt5     p50     p90
                              0       0       0.00    0.00    0.00    0.00

重要なのは、 Forwarding の2つ目の値で、これが意味するところは、
「ローカルでRailsサーバが動いている localhost:3000https://cb413e80.ngrok.io というパブリックなURLにポートフォワーディングしている」

となります。
パブリックURLなので、自分のMac以外からも、つまりLINE Messaging APIからも自分のMacで動いているRailsサーバにアクセスさせることができます。
というわけで、このURLをLINE botの「Webhook URL」に設定しましょう。

f:id:shifumin:20180501213845p:plain

これで、 rails s を起動しているかつ ngrok http 3000 を起動している状態だとローカル開発環境から直でLINE botの動作を確認することができます。
例えば、コードを修正してbotの動作を変更させた時に、いちいちHerokuにデプロイすることなく動作を確認することができます。
楽でいいですね。
ちなみ、ngrokの起動を止めるとパブリックURLへのフォワーディングも止まります。
また、割り当てられるパブリックURLも起動のたびに異なるものとなります(= ngrokの起動のたびにWebhook URLの設定の変更は必要)

終わりに

今回はローカル環境での動作確認をやっていきました。
次回は今回の続きでローカル環境でのデバッグをやっていきましょう。

参考

ngrok - secure introspectable tunnels to localhost
https://ngrok.com/

ngrokを使用してローカル環境を外部に公開する - Qiita
https://qiita.com/kitaro729/items/44214f9f81d3ebda58bd

Homebrew-Cask
https://caskroom.github.io/

direnv/direnv: Unclutter your .profile
https://github.com/direnv/direnv

direnvを使おう - Qiita
https://qiita.com/kompiro/items/5fc46089247a56243a62

DotenvではなくDirenvを使う | SOTA
https://deeeet.com/writing/2014/05/06/direnv/