ちょうど明日勉強会で Jenkins セットアップするので、Line BOT で色々通知できないかなーというノリで参加してみました。
結論から言えば方向性が違いましたが、色々サービスに触れて面白かったのでここで紹介してきます!
まず最初に使うサービスをザックリ紹介。
Codenvy はオンライン IDE なんて言う素敵なアイテム。
勉強会でハンズオンするのに、IDE 宗教とか面倒だろうし、何かと重宝しそうですね。
Git リポジトリを選択すると、Docker 上の Linux に clone して色々な編集ができます。
Linux ターミナルが使える所がまたイイ!
関連記事: Codenvy使ってみた - Qiita
Heroku はクラウド黎明期から速攻で PaaS を始めてるクラウドサービス。
昔使った事が一時期あったのだけど、長らく使う機会がありませんでした。
特徴は、ともかくシンプル!
サービス開始までの手順がもっとも少ない PaaS なのではないでしょうか?
ラストは…説明不要のサービス。
BOT 作成には Developper アカウントが必要ですが、こちらも基本的に LINE の QR ログインで登録できてしまいます。
いやはや便利になったものです。
開始
自己紹介から開始。
今回の講師は、主:桑原さん、ヘルプ:マツダさん、長岡さん
本日の内容。
X-Hack さんは、非エンジニア向けにプログラミングの啓蒙等をされている会社さんです。
ごめんなさい現役エンジニアが興味本位で枠奪ってしまって(汗
LINE の設定
まず LINE Developper にログインするとこんな画面になります。
「新規プロバイダー作成」からプロバイダー名を入力して
「確認」「作成する」でさっくりプロバイダーを作ります。
次に「チャンネルを作る」に進んで、適当な名前の BOT を作りましょう。
「Developper Trial」ってイイですねー
ジャンルは適当に選びましょう。どうせ作り終わったら消します(汗
メールアドレスは、自動入力だとエラーになります。
必ず手入力で…キーバインドチェックか何かしてるようです。
確認画面などは代わり映えしないので省略します。
ハンズオンだったのでさして読みきれてませんでしたが、改めて読んでも常識的な事が書いてありました。
作ったチャンネルを選択して
チャンネル基本設定から「Channel Secret」と「アクセストークン」をコピーします。
(ここはそこそこ危険なエリアなので、スクショはなしです)
スクロールしていくと、「LINE アプリへの QR コード」があるので、それを経由で登録してしまいましょう。
ちなみに近くにある項目の「自動応答メッセージ」や「友達登録時あいさつ」は邪魔になるので、「利用しない」に設定しておきます。
Heroku
次は Heroku にログインします。
なお、アカウント作成などは特に説明しませんのでご了承ください。
とりあえずこれで放置(笑
Codenvy
Codenvy にログインしたら
サイドメニューから
Workspace > add workspace を選択し、
- select stack : node
- projects : 「git」を選択して、「https://github.com/x-hack-git/line-messaging-api.git」を使わせてもらいます。
先に進むと、勝手に clone していじれるようになります。
terminal で unix コマンド使えるので Docker かなと思ったら Docker のようです。
10 分位放置するとコンテナ消される(汗
ターミナルに、Heroku のコンソールをインストール。プロジェクトルートに移動して
$ curl https://cli-assets.heroku.com/install.sh | sh
$ cd line-messaging-api
そしたら heroku にログイン
$ heroku login --interactive
ID/Pass は登録したものを使いましょう。
$ heroku create azalea-example-bot $ git push heroku master
その場で heroku アプリ(兼リポジトリ)をこしらえて push 。
このあとで Heroku の画面をみてみると上がってる…
残りの環境変数設定
先ほど LINE から拾った 「Channel Secret」と「アクセストークン」を、Heroku に設定します。
先ほど作ったアプリケーションを開いて、「Setting」から「Config Vars」に設定します。
コラム: この手のパスワードを、ソースコードに絶対に書いてはいけません。github に上げようものなら、十数分でぶっこぬかれれ、最悪うん十万と支払いが飛んできます。
お次は、Heroku の右上の「Open App」を開きます。
おきまりの「Hello World」ですねーこの URL をコピーします。
最後は LINE Developper に戻って
WebHook URL に最後「/callback/」をつけて登録。WebHook 送信を「利用する」に設定します。
なんかバグっぽい挙動で、 WebHook送信の項目を後に設定しないと、なぜか設定が一部リセットされる模様。
ここまで来たら LINE を確認
初期動作仕様は、適当に喋ったらこんにちはで返してくれるのみです。
実際のハンズオンでは、ここから ぐるなびさん API と連携したりとか色々やりました。
とはいえ、中のソースをみる限りはシンプルに JSON でごにょごにょしてるだけ…!
Web 屋さんならお気づきだろう!なんでもできる…と!
というような内容でした。