【Rails/Ruby/Docker/LINE messagingAPI/Heroku】単語帳bot

1.はじめに

当記事は、LINE messagingAPIを活用したアプリケーションの開発の流れをまとめた記事になります。

LINE messagingAPIを活用して、開発したい方の参考になればと思います。

2.開発アプリ

まず私が開発したアプリについて紹介します。

• アプリ名　「単語帳bot」
• 公式LINEなので下記QRコードから友達登録できます。

LINEでのトーク画面で、問題、答えの登録を可能にし、自作の単語帳や問題集として使用できます。

• デモプレイ動画

使用言語等

• Ruby, Ruby on Rails
• LINE messagingAPI
• Heroku(PostgreSQL)

3.開発の流れ

※ railsアプリ作成の流れは省略します。

LINE Developersの登録とチャネル作成

• LINE Developersに登録（支障がなければ、自身のLINEアカウントで問題ありません）

• プロバイダーの新規登録をします。

• チャネル設定で新規チャネルの登録をします。この時、チャネルの種類はMessagingAPIを選択してください。

これでチャネル登録は終わりました。

gemの追加

• 作成したrailsアプリのGemfileにgem line-bot-apiを追加して、bundle installしてください
• app/controller/linebotcontroller.rbを作成してください。
• linebotcontrollerの中身は公式ドキュメント内のexamplesを参考にしてください。

app/controller/linebotcontroller.rb

class LineBotController < ApplicationController

  require 'line/bot'  # gem 'line-bot-api'

  def client
    @client ||= Line::Bot::Client.new { |config|
      config.channel_secret = ENV["LINE_CHANNEL_SECRET"]
      config.channel_token = ENV["LINE_CHANNEL_TOKEN"]
    }
  end

  post '/callback' do
    body = request.body.read

    signature = request.env['HTTP_X_LINE_SIGNATURE']
    unless client.validate_signature(body, signature)
      halt 400, {'Content-Type' => 'text/plain'}, 'Bad Request'
    end

    events = client.parse_events_from(body)

    events.each do |event|
      case event
      when Line::Bot::Event::Message
        case event.type
        when Line::Bot::Event::MessageType::Text
          message = {
            type: 'text',
            text: event.message['text']
          }
          client.reply_message(event['replyToken'], message)
        end
      end
    end

    "OK"
  end
end

このコントローラーの中身をいじると、自動で返ってくるメッセージの中身を変えることができます。

このコントローラーの中身を簡単に説明しますと、
まず、post /callbackが実行（メッセージを受信）されて、今回の場合だと

  case event.type
  when Line::Bot::Event::MessageType::Text

にジャンルされるので、変数messageにtext: event.message[text]が入ります。
この場合のtext: event.message[text]は受信したメッセージになります。

そしてreply_messageメソッドの第１引数にreplyToken,第２引数に先ほどのmessageを渡して、メッセージを送信します。

いわゆるオウム返しになるわけです。（「あ」て送ったら「あ」って返ってくる。）

コントローラーの編集

先ほど作成したコントローラーを色々と編集することで、色々な機能をつけたりすることができます。

本アプリの場合

まずは、問題の登録、削除ができるように、dockerを使用してDBを構築しました。

ちなみにER図は簡単なもので、

となっています。
Userのuidは、メッセージを受信した時のLINEのuidをUser[:uid]としてアプリのDB登録に登録されるのでユーザー毎に問題は管理されます。

コントローラーの編集内容は以下のとおりです。
※「」は受信したメッセージを表す。

• メッセージを送信したLINE userをuidでfind_byして見つからなければ、そのuidを元にcreate!する。

• 「説明」・・・本アプリの説明文章を送り返す。

• 「問題」・・・登録済みの問題をindex番号を付して送り返す。

• 「問題を作る」・・・問題の作り方についての説明文を送り返す。

• 「問題＝」・・・＝以下の文章をQuestion[:body]に登録し、続けて答えの登録方法についての説明文を送る。

• 「数字：答え＝」・・・問題のindex番号と送られてきた数字の合致するレコードを取得し、＝以下の文章をQuestion[:answer]に登録する。

• 「削除」・・・index番号を付して問題一覧を出力する

• 「削除１」・・・問題一覧のindex番号と送られてきた数字の合致するレコードをdestroyする

コードについてはGitHubで公開しているので、参考にしてみてください。

Herokuへのデプロイ

※herokuアカウント登録済みの上で話進めますので承知願います。

$ heroku login

すると

heroku: Press any key to open up the browser to login or q to exit: 

と出ますので、エンターキー押してもらえれば、ブラウザ画面にherokuのログイン画面が表示されますので、ログインしてください

デプロイ準備

• もし、アプリの開発環境でMySQLを使用している場合は、PostgreSQLに切り替えてください、herokuではMySQLは基本使えません。

Gemfile.

group :production do
  gem "pg"
end

こんな感じでGemfileにgem pgを追加してください。テスト環境や開発環境でMySQLを使う場合は、group :development, :test doに移動させてください。

追加終わったら、bundle installしてください。

• Procfileの作成

Gemfileとかと同じ階層にProcfileを作成してください。
作成したファイルには、以下のコードを追加してください。

Procfile.

web: bundle exec rails server -p $PORT

このコードにより、Heroku反映時にrails sが起動されます。

heroku上に公開場所を作成

$ heroku create [アプリケーション名]

とするとherokuに公開場所が作成されます、アプリケーション名を指定しない場合は、heroku createのみで大丈夫です。

アドオンの追加

$ heroku buildpacks:add --index 1 heroku/nodejs
$ heroku buildpacks:add --index 2 heroku/ruby

でRubyとnodeのアドオンを追加

環境変数の追加

$heroku config:set LINE_CHANNEL_SECRET=秘密鍵
$heroku config:set LINE_CHANNEL_TOKEN=チャンネルトークン

を追加します。

LINE Developersの以下の画面で確認できます。

• チャネル基本設定の部分に秘密鍵
• MessagingAPI設定の部分にチャンネルトークン
  が記載されています。

デプロイ

$ git push heroku main
$ heroku run rails db:migrate

で、herokuへのデプロイは完了！

もしうまくいかなかったら

herokuへのデプロイはエラーがつきものなので、別の方法も書いておきます。
まずはherokuをブラウザで開いてください。
ブラウザ画面のDeployment methodの部分に注目してください。

通常はHeroku Gitでデプロイしますが、GitHubと連携させてデプロイする方法もあります。
今回はこのデプロイ方法について説明します。
Deployment methodのGitHubを選択してください。
repository名を入力してください。
連携がうまくいけば、Deployment methodのGitHubの下にConnectedの文字が表示されます。

Connectedになったら、画面をスクロールして一番下まで移動します。
Manual deployにあるDeploy Blanchボタンを押すと、デプロイが始まります。
デプロイの最中エラーになることもありますが、エラーコードが表示されますので、エラーコードに従って、ファイルを訂正等すれば、うまくデプロイできると思います。

MessagingAPI設定

LINE Developersの、MessagingAPI設定を開いてください。

• まずWebhookの利用を有効にしてください。
• Webhook URLのアプリ名のところにデプロイしたherokuのアプリ名を入れてください。
• 更新ボタンを押した後、検証ボタンを押してください。成功と表示されれば、連携完了です。

QRコードから友達登録して、実際に動くか試してましょう！

4.開発の背景

• 社会人になってからも意外と勉強する機会は多い。
• 分厚い参考書を見ると、余計にやる気がそがれ、なかなか勉強する気になれない。
• ついつい現実逃避で、スマートフォンをいじってしまう。

前職で私が経験したことになります。
この経験から、
もっと気軽に勉強できるようにしたい！
と思い、開発しました。
LINEはついついいじってしまうアプリの一つです。いじったついでに一問だけやるとか、気軽にできればと思います。

5.まとめ

今回はLINE messagingAPIを活用したアプリ開発の流れやデプロイ方法について記事を書きました。
同じく、エンジニア転職を目指す方やプログラミング初学者の方のお役に立てればと思い、執筆しました。
もし、参考になった場合はLGTMしてもらえると大変嬉しいです。