做個 Line Bot 來玩玩

做個 Line Bot 來玩玩

一月 01, 2017

Line Bot With Line Messaging API

前言

Bot 已成為一門顯學，從 Telegram 、 Facebook 、 Skype 、 Slack 到 Line 釋出相關的 API 給開發者。翻翻各家 API 都可以發現 Bot 說穿是釋出各家 Chat 的 API 接口 + Webhooks 攔截 User Request 後進行轉發，說穿這門技術就現今而言門檻很低。

為何選 Line Bot

市占率與 APP 的定位！

  • 市占率
    在臺灣應該是成現 Line > Facebook Messenger > Slack >= Telegram / Skype ，因此為了之後辦活動時可以使用， Line 就很理成章成了最佳選擇。
  • 定位
    • Slack：加速團隊溝通，減少訊息的等待空窗期
    • Telegrame：和 Line 定位相近，主打安全性，在 Line 還沒為訊息加密時，它一開始就是加密，不過 8 月爆出被駭)
    • Messenger Platform：一樣使用 Facebook Messenger ，不過主要是供 Fans Page 使用，其服務對象是粉絲對 Fans Page 發訊息
    • Skype：通話是 Skype 的價值核心

Line Bot 實作注意事項

  1. Line Bot API 在今年做了一次大改版，舊版的 Bot API 已被放進汰除名單，取而代之是 Message API ，別使用到舊得 API 。
  2. 實作 Framework 使用 Koa@2 + Babel (為了 async/await )

Line Bot 帳號申請

  1. 到 Line Business 登入
    Line Business 畫面
  2. 輸入 Line 的 Email 與密碼，手機要準備好，登入時需要在 Line APP 上輸入驗證碼
    登入 Line
  3. 新增公司，因為 Line Messaging API 需要綁在公司下
    新增公司資料
  4. 建立商用帳號
    建立 Line Bot 的商用帳號
  5. Messaging API 選 開始使用Messaging API 或開始使用Developer Trial
    • 回應功能： 開始使用 Messaging API
    • 回應 + 主動推訊息： 開始使用 Developer Trial
      選擇申請的 Messaging API 權限
  6. 建立 Line Bot 帳號
    填寫 Line Bot 資料
  7. 前進 LINE@MESSAGER
    LINE@MESSAGER
  8. 開始使用 API
    開啟 Messging API 的注意需知
  9. Webhook傳訊 改為 允許
    開啟 Webhooks 功能

Koa 與 Line Messging API 的合作

  1. 到 Line Business 帳號清單，選要實作的 Bot 並點 LINE Developers ，將 Channel Serect 的密碼留下來
    Line Bot 設定
  2. 掛載 Babel
    1
    2
    3
    require('babel-core/register')({
      plugins: ['transform-async-to-generator']
    });
  3. 使用 Koa 建立 Webhooks + 身份認證
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    const koa = require('koa');
    const app = koa();
    // 送 Request 用 ( 也要安裝 request package )
    const request = require('request-promise');
    // 載入 crypto ，等下要加密
    const crypto = require('crypto');
    // 放 Line Bot 的 Channel Secret
    const channelSecret = '...';
    // 按 Line 的規定設定加密
    const hash = crypto.createHmac('sha256', channelSecret)
              .update(Buffer.from(JSON.stringify(koaRequest.body), 'utf8'))
              .digest('base64');

    const router = require('koa-router');
    router.post('/webhooks', async (ctx, next) => {
        // 取 User 傳送得資料
        // 和 Request 送來做比對 ( Status Code 這階段會有 200 / 401 )
        if ( koaRequest.headers['x-line-signature'] === hash ) {
          ctx.status = 200;

          // User 送來的訊息
          ctx.request.events

          // 回覆給 User 的訊息
          let options = {
            method: 'POST',
            uri: 'https://api.line.me/v2/bot/message/reply',
            headers: {
              'Content-Type': 'application/json',
              'Authorization': `Bearer ${auth.token}`,
            },
            body: {
              replyToken: replyMessage.replyToken,
              messages: [{
                  type: 'text',
                  text: '是文字',
                }],
            },
            json: true,
          }

          await request(options);

        } else {
          ctx.body = 'Unauthorized! Channel Serect and Request header aren\'t the same.';
          ctx.status = 401;
        }
    });

    app.use(router);

    app.listen(3000, function () {
      console.log('Example app listening on port 3000!')
    });
  4. 以上完成基礎 Line Bot 的建置內容，接下來將 Code 放入 PaaS 等空間與到 Line Developers 設定對應的 Webhooks 的位置既可讓自己的 Bot 運作。

成品分享

正確回覆訊息的 Line Bot

Easy Line Bot

有需要的人可以 Fork 回去或發 PR 給我，想要玩玩可以掃下方 QR Code 加 Bot 為好友（若 Bot 沒有反應，等它一下。因為放 Heroku ，此服務一段時間沒有使用會將 Server 進行睡眠，等有人使用再喚醒）

Line Bot 的 QR Code

參考資料

  1. 聊天 APP 的 Bot API
  2. Line Messging API
  3. Bundit J. - linebot
  4. Ivan Wei - 從零開始認識 Node.js