Chatbots meetup 聊天機器人小聚 #20 @ LINE Taiwan Office

台灣的疫情終於漸漸的穩定下來,各個社群的線下活動都開始陸續恢復運作了。Chatbot Taiwan 也迎來期待已久的第 20 場小聚!這次小聚選在熊大寶殿舉辦,很感謝場地方 LINE 提供場地和贊助美食、飲料,讓大家分享交流之餘,還能吃飽喝足,希望每個人都能滿載而歸!在心得開始前,先放上這次的活動資訊

KKTIX:https://chatbots.kktix.cc/events/meetup-020

共筆:https://hackmd.io/@chatbot-tw/meetups-020

直播回顧:https://youtu.be/VxcpDFHWOb8?t=2146

接下來就是這次活動的心得

第一個出場的是 Evan ,一樣為我們帶來這個月有關於 LINE API 的更新

總結一下,這個月的主要更新如下:

  • Flex Message Simulator tutorial 的釋出
  • Messaging API 的更新,這次更新和 group, chat room 有關,可以取得使用者的名稱圖片和狀態了
  • Linked OA 的位置做了調整
  • LIFF v2.2.0 released,加入了 LIFF 錯誤碼

Evan 還提供了一隻 Demo 機器人,示範了這次的 Messaging API 的更新中,如何取得 group, chat room 的更多資訊

程式碼範例:https://github.com/kkdai/linebot-group

這真是個不錯的一隻 API ,以往 group, chat room 沒有這隻 API 的話,很多互動都不能實現,有了這隻 API 的加持,以後應該會有更多有趣的應用出來!

第二場是由 煥杰 分享的『專為高中生設計的管家型聊天機器人 』。

當初設計這隻機器人是作者為了協助班上同學常常忘了帶考師準備的書籍,以及提醒同學未來幾天考試而誕生的一隻機器人。去年九月開始做這隻機器人,十二月就完成了第一階段開發

分享了一些開發過程遇到的問題,例如說:原本的架構是用 google sheet ,但是會有一些限制,就是每 100ms 只能有 100 requests,所以才需要搬移到 MySQL 上。以及分享暑假打算怎麼重構、Web Hosting 想搬到 Lamda、DB 想改用 NoSQL、Python 想改成 JavaScript

後來因為疫情的關係,還增加了體溫回報系統,未來還會添加人臉辨識結合體溫測量、網頁管理介面,以及推廣到全台灣高中。

是個很有想法的高中生,從生活中找到問題,捲起袖子解決問題,祝福這隻機器人可以順利完成後續的開發!

接著是 Richard 分享的 LIFF & Firebase

Firebase 對我而言一直是個有點陌生的東西,之前待在快速買早餐的時候,常常聽到,但是沒有實際去應用。聽完這次的分享,有點燃起我想去玩玩看的動力

其中有講到 Firebase hosting ,他有以下幾個特性:

  • 可以放置 web page (很像是 S3
  • 幫助網頁開發的功能
  • 分析工具(FCM)
  • Firebase is a collection of mobile-related products
  • CDN 機房就在台灣/香港
  • No cold start(不像 heroku 會睡著)
  • firebase cloud function (JS/TS)
  • cloud fire store (很像 mongo DB,而且在前端就可以接上,不需要 server side 的 code)

Firebase 也提供了安全認證相關的機制,可以讓管理人員處理新增刪除這類較危險的操作

透過淺顯易懂的說明,讓我更了解 Firebase ,之後找個時間可以來研究看看!

最後一場是卡米哥分享的『對話式表單架構設計

這個議題一直是大家很有興趣的議題,我之前在開發快速買早餐 5breakfast 的 chatbot 也遇到這個問題。對話式表單常常遇到的就是,如何協助用戶完成目標?如何向用戶索取資訊?如何呈現一個好的對話介面?缺乏資訊要怎麼反問?多欄位填寫的處理?

卡米哥利用了點飲料的需求,清楚的帶大家認識整個對話的流程,還帶大家認識了 DialogFlow

不過遇到這種問題,我一律建議做成 LIFF 

最後是閃電秀的部分

首先出場的是佳新哥分享的 LIFF 圖片測試工具,這個工具可以減少設計師和工程師溝通障礙。

黃鈞亭分享了如何結合 LINE 和 Google Suite 來做定時回報系統 因為軍中使用 LINE 回報遇到的問題,而讓講者動身實作一隻機器人處理問題。(現在當兵都這麼輕鬆?

最後一個是即時通智慧攝影機,攝影機在偵測的過程,如果發現有人經過時則會 push message 做通知。這隻機器人滿像我之前待在谷林運算的時候開發的機器人,我們也是結合一些 IOT 應用,監測到工廠產線出現異常的時候會主動推播通知

這次的分享依舊很有趣,也很精彩,學習到很多東西,也認識很多人。最後附上工作人員合照,這次又多了些新夥伴,希望聊天機器人社群越來越壯大!

LINE TAIWAN TECHPULSE 2019 參加心得

今年也是第三次參加 LINE TAIWAN TECHPULSE 了,這次很感謝 NiJia 和 Evan 的邀請,讓小弟我可以坐在前排搖滾區,更近距離的看到各項精彩的議程。今年的內容可以看到 LINE 在任何地方都有提到 ML ,看的出 LINE 的野心和佈局,看得我也想學習 ML 了(誤

活動資訊

LINE 台灣舉辦第四屆開發者大會「LINE TAIWAN TECHPULSE 2019」,藉此科技產業的年度盛事,為台灣開發者提供來自日本 DevDay 2019 的第一手訊息,實現「開發工程(Engineering)」、「產品開發(Production)」的願景,並為開發者介紹 AI 人工智慧、資訊安全、測試自動化、敏捷開發、新創團隊分享等眾多領域的最新趨勢。

演講嘉賓包含國際知名資安專家李丞鎮 (Beist)、NAVER Clova AI Chatbot AutoML 專家李在元 (Jaewon Lee)、 LINE Timeline Post 推薦系統負責人李知洪 (Jihong Lee),以及眾多各領域專家,於現場傳授專業知識,回歸開發者本質,以實務觀點探究產品開發,並介紹 LINE 開放平台資源與創新應用,敬邀您蒞臨參加!

活動議程

TIMETOPICSPEAKER
09:30 – 09:35OpeningRoger Chen
09:35 – 10:00KeynoteMarco Chen
10:00 – 10:30LINE Platform API UpdateEvan Lin
10:30 – 10:40Break
10:40 – 11:20AutoML in Clova Chatbot Builder Framework (English)Jaewon Lee / Penny Sun
11:20 – 12:00How LINE Does Enterprise Security (English)Beist
12:00 – 12:30Timeline Post Recommender System (English)Jihong Lee
12:30 – 13:30Lunch Break
13:30 – 15:10Protostar Program Introduction & Startup DemoKevin Chen
15:10 – 15:40LINE Pay – New Features of LINE PayWebber Su / Sabrina Lee
15:40 – 15:50Break
15:50 – 16:20LINE SPOT and How We Build ItJulian Shen
16:20 – 16:50Lightning Talk – Data Pipeline and Data ProcessingYumei Chen / Jim Horng / Denny Tsai
16:50 – 17:20Lightning Talk – Data Science and AnalyticsShawn Tsai / Liwen Liao / Johnson Wu
17:20 – 17:50Lightning Talk – Client and AutomationDaniel Kao / JJ Lin / Winter Hung
17:50 – 18:00ClosingMarco Chen

場地與報到

這次的 LINE 官方帳號有比去年的順很多,我記得去年我開了藍牙弄了半天都收不到通知。今年的我才剛下車在去會場的半路上就收到座位通知。

Imgur

再走個幾步路就看到大大的 LINE TAIWAN TECHPULSE 2019 牌子 在歡迎大家了!

Imgur

接著就拿著這個座位畫面,到前台去報到,前台工作人員會協助綁上手環,手環顏色作為場地位置的區分。這次的座位在前排水藍色搖滾區。

Imgur

今年活動會場有別於以往,弄的超有氣氛的,感覺很嗨!!

Imgur

Opening & Keynote

前面兩場是 LINE 台灣總經理 Roger 和 Marco 的分享,大概就是 LINE 的企業目標

  • LIFE on LINE ,反正就是希望生活的每個角落都有 LINE。
  • LINE Brain:LINE 是一個致力於 AI 公司,將來會提供給開發者可以去運用 ML 相關的服務,這點我還滿有興趣的。

LINE Platform API Update

這場提到了 LINE 更加注意 UX/DX ,不僅僅是注重使用者體驗,也很在意開發者在開發上的體驗,比如說文件有中文版了,LIFF 以往在開發的時候超克難,LIFF 2.0 改成能用瀏覽器登入,通訊協定從 line:// 改成 https://,也就是說現在可以在電腦上面直接打開 debug (撒花

還有帶來的幾個新的 API ,其中我最開心的是終於可以批次更新 rich menu 了,以往要幫使用者更新 rich menu ,是一件超級崩潰的事情,要一個一個使用者去重新 link 起來,現在終於不用了(再次撒花
Imgur

另外還推了下,Flex Message Simulator(Beta):由別於以往 Flex Message Simulator(Alpha) ,新版的提供了圖像化介面,可以有效協非工程背景(看不懂 JSON)的去設計介面。順便廣告一下自己,如果在 Flex Message 開發上缺乏靈感,不妨來逛逛我的 Flex Box

另外,也介紹了 OA 2.0 所帶來的好處。

AutoML in Clova Chatbot Builder Framework

這場介紹了 Clova Chatbot Builde,就是提供了一很棒的介面,可以去製作 Clova Chatbot,然後 CLOVA AutoML 還導入 NLP 模型,講者野解釋了,模型如何被建立、分類,提高 performance

How LINE Does Enterprise Security

對資安的議題比較沒感覺,所以我這場我就沒有筆記了

Imgur

Timeline Post Recommender System

Timeline 要建立一個高度個人化的動態牆。這場講了些建立模型遇到的問題,還有怎麼做。

Break

接著是午餐時間,這次沒有提供便當,可能是天氣冷的關係,餐點都涼掉了….我覺得有點美中不足
Imgur

Protostar Program Introduction & Startup Demo

因為之前在前公司 5breakfast ,負責推產品上 LINE Protostar ,所以這是我最關心的議程。這次有 10 家公司入選成為 Protostar。這次讓 10 家輪流上台介紹自己的 LINE chatBot。私心覺得這次醫療相關的真的很多,看來 LINE 很想進入醫療領域這塊

  • 牙醫小幫手:這是前公司隔壁桌的好鄰居,當初的 chatbot 問題還滿多的,不過現在進步神速,流程改的很順暢
  • 記帳雞:未來將會有點數機制,也和銀行在討論整合的可能。
  • AlleyPin:也是牙醫相關的。
  • 途你:給學生的旅遊平台,可以租車,然後也有自己的車。
  • 肚肚:跟前公司 5breakfast 做的事情有點類似,但是更完善了,從購買餐卷到訂位,甚至於後面那段串接 POS ,相當完善。
  • 通勤學:學習服務,這個滿有趣的,我聽完之後馬上就上去『聽』了幾堂有趣的課。
  • MONTAGG:影片推薦系統。
  • TikiPoki:一售票系統,算是 LINE 上面少數的販售票卷服務。
  • DR.LINE:又是一間診所。
  • U-Life+:提供慢性病處方籤服務。簡報滿滿的新細明體,很崩潰…

LINE Pay – New Features of LINE Pay

LINE 要可以跨海交易了!以後去日本、韓國和泰國,也可以刷 LINE Pay 了。

LINE Pay 改變了舊框架 Batch Processin,但是遇到一個問題,就是說在第一階段交易階段,接著第二階段清算階段,在這過程效能會越來越慢,如何改成全新的框架 Realtime Processing,藉以提升效能。

另外,LINE Pay API v3 來了,這次在認證上做了改變,第三版使用新款電子簽證。以及為了滿足多產品綁在一起的需求,把產品欄位設計從 single 調整為 multi

另外,以後真的可以不用帶錢包了(笑),現在連會員卡片都要整進 LINE Pay 囉

imgur

LINE SPOT and How We Build It

這場議程提供了 micro services 的整合範例,講解了 micro services 的好處,以及 micro services 怎麼去做,面對服務越來越肥大,流量越來越大的應用,這場是個很好的經驗分享,值得去效法

接著是 Lightning Talk ,但是也很想去外面的攤位晃晃,所以我就沒有參加到,這次有 LINE 的各個 team 的攤位,可以和他們直接面對面問問題,也有 LAE 的攤位,可以和 LAE 聊聊 LINE API 遇到的問題,雖然我都在聊 AWS 的東西(誤)

接著是,這次這一次的紀念品,側背包和衣服,我覺得側背包還不錯的,設計的很酷
imgur

我覺得這次整體時間控制很差,整個時間一直往後延(一個小時有吧…)。另外場地雖然很炫,但是在講者登台時的燈光特效,都直接直射眼睛….非常的刺眼不舒服,相較起來,我比較喜歡去年和前年的場地。另外提供餐點都是涼的,午餐吃起來滿崩潰的,加上動線問題,搶食物超級艱難…

然後,這次議程內容相當紮實,可以說是收穫滿滿。只是聽議程需要十分專注,一整天下來,真的還滿吃力的!

總之,謝謝 LINE 提供這麼棒的活動。明年見!

LINE 聊天機器人: Hello world!

前面講了這麼多,終於要進入重點了。現在來寫一個會回應的 LINE 聊天機器人吧!

無論你是透過 Laravel 安裝工具 的 laravel new 或是 composer create-project 的方式 都可以,反正就是新安裝一份 Laravel 專案吧!

在你安裝完 Laravel 後,首先需要做的事情就是設定一個隨機字串到應用程式金鑰。如果這金鑰沒有被設定的話,你的使用者 sessions 和其他的加密資料都會不安全,因此我們需要來設定一下應用程式金鑰。

假設你是透過 Composer 安裝 Laravel,這個金鑰有可能已經透過 key:generate 指令幫你設定完成,如果沒有的話,試著輸入 php artisan key:generate 產生應用程式金鑰吧

首先,我們來設定 `route` 的部分,讓 LINE 可以打入我們設定好的 webhook ,打開 routes/web.php

插入一行

Route::post('/callback', '[email protected]');

此時我們只要去 LINE Developer 後台的 webhooks 網址添加 /callback (如下圖),每當使用者跟機器人講話的時候,就會觸發 LineController 裡面的 webhook 這個方法

img

剛剛我們有提到 LineController 裡面的 webhook 方法,所以我們來建立一個,輸入 php artisan make:controller LineController ,此時 app/Http/Controllers/ 裡面會多了一新的 controller,我們在裡面增加一點東西,讓他可以接受 LINE 的訊息,然後回應

接著我們需要安裝 LINE 提供的 SDK ,所以下個指令 composer require linecorp/line-bot-sdk ,來安裝 line-bot-sdk ,安裝完成後就可以開始寫 code 囉!

我們先建立一個 app\Http\Controller\LineController

<?php
namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Log;
use LINE\LINEBot;
use LINE\LINEBot\Event\MessageEvent;
use LINE\LINEBot\HTTPClient\CurlHTTPClient;

class LineController extends Controller
{
    private $client;
    private $bot;
    private $channel_access_token;
    private $channel_secret;

    public function __construct()
    {
        $this->channel_access_token = env('CHANNEL_ACCESS_TOKEN');
        $this->channel_secret = env('CHANNEL_SECRET');

        $httpClient = new CurlHTTPClient($this->channel_access_token);
        $this->bot = new LINEBot($httpClient, ['channelSecret' => $this->channel_secret]);
        $this->client = $httpClient;
    }

    public function webhook(Request $request)
    {
        $bot = $this->bot;
        $signature = $request->header(\LINE\LINEBot\Constant\HTTPHeader::LINE_SIGNATURE);
        $body = $request->getContent();

        try
        {
            $events = $bot->parseEventRequest($body, $signature);
        }
        catch(\Exception $e)
        {
            Log::error($e->getMessage());
        }

        foreach ($events as $event)
        {
            $replyToken = $event->getReplyToken();
            if ($event instanceof MessageEvent)
            {
                $message_type = $event->getMessageType();
                $text = $event->getText();
                switch ($message_type)
                {
                    case 'text':
                        $bot->replyText($replyToken, 'Hello world!');
                    break;
                }
            }
        }
    }
}

 

先來講講 __construct 。這個其實很簡單,就是拿著你的 .env 裡面的 Channel secret 和 Channel access token 去建立一個 LINEBot 物件。

緊接著是 函式 webhook 中

$bot = $this->bot;
$signature = $request->header(\LINE\LINEBot\Constant\HTTPHeader::LINE_SIGNATURE);
$body = $request->getContent();

try {
    $events = $bot->parseEventRequest($body, $signature);
} catch (\Exception $e) {
    Log::error($e->getMessage());
}

 

我們先取除剛剛建構的 LINEBot 物件,然後去接收 $request ,接著 透過 try... catch 去看看這個 $request 能不能夠正確被處理,如果可以的話,就可以開始做事情啦!

接著是最後一段,也是最核心的部分

foreach ($events as $event) {
    $replyToken = $event->getReplyToken();
    if ($event instanceof MessageEvent) {
        $message_type = $event->getMessageType();
        $text = $event->getText();
        switch ($message_type) {
            case 'text':
            $bot->replyText($replyToken, 'Hello world!');
            break;
        }
    }
}

 

如果能夠正常處理請求,過來的東西會是一個陣列,裡頭有許許多多的 event ,而這個 event 裡頭有許多資訊供我們使用,首先我透過 $event->getReplyToken() 去取得 ReplyToken ,等等回覆給使用者的時候要用這個 token ,這組 token 存活時間非常短暫,所以我們接收到使用者的訊息,必須馬上把它用掉

接著我用 if ($event instanceof MessageEvent) 去確認事件類型是 MessageEvent 。至於這是什麼東西呢?先別急,之後我會介紹更多的事件類型,緊接著 if 裡面的第一行,我們先透過 getMessageType 取得訊息類型,還有 getText() 取得文字內容,再透過 switch 的方式判斷 訊息類型 是不是 text

最後,我們透過剛剛建立的 $bot 這個 LINEBot 物件中的 replyMessage 來回覆訊息給使用者吧!這樣核心的程式就完成的差不多了

然後剛剛有提到 env ,所以我們來去 .env 添加兩個環境變數吧!其中一個是 CHANNEL_ACCESS_TOKEN 另一個是 CHANNEL_SECRET ,還記得我在 先有一個 Line Messaging API account 這個章節一直提到的 Channel secret 和 Channel access token 嗎?這時候終於派得上用場囉!把他填上去就對了

CHANNEL_ACCESS_TOKEN={{ YOUR_CHANNEL_ACCESS_TOKEN }}
CHANNEL_SECRET={{ YOUR_CHANNEL_SECRET }}

感覺好像都可以了,試著去和 chatbot 聊天的時候,會發現他還是都不理人!!!

沒錯!因為 Laravel 這邊有個小小的坑,就是 Laravel 很貼心地做了 Csrf Token 驗證,所以 LINE 打過來的資料被視為非法的,所以被拒絕了!因此我們需要讓 LINE 打過來的這個 webhook 是暢通的。

先打開 app/Middleware/VerifyCsrfToken.php ,修改內容

<?php
namespace App\Http\Middleware;
use Illuminate\Foundation\Http\Middleware\VerifyCsrfToken as Middleware;
class VerifyCsrfToken extends Middleware
{
    /**
     * Indicates whether the XSRF-TOKEN cookie should be set on the response.
     *
     * @var bool
     */
    protected $addHttpCookie = true;
    /**
     * The URIs that should be excluded from CSRF verification.
     *
     * @var array
     */
    protected $except = ['/callback'
    // 添加這行
    ];
}

 

這樣就會告訴 Laravel 說 /callback 這個路徑就不需要做驗證囉!這樣再去找聊天機器人聊天,應該就會 Hello world 了喔!

Webhook 資料格式

看到這邊,應該會好奇,當使用者每次和機器人聊天的時候,LINE 也會打到我們提供的 webhook URL ,那 LINE 究竟給了我們什麼呢?

我們先試著在上一篇建立的 app\Http\Controller\LineController 中修改一些東西,印出來看看

try {
    $events = $bot->parseEventRequest($body, $signature);
    Log::info($events); // 增加這個 Log,將收到的訊息印出來
} catch (\Exception $e) {
    Log::error($e->getMessage());
}

 

然後對著聊天機器人傳送一則訊息看看,就可以看到這個 $events 裡面到底放了什麼?

array (
0 =>
LINE\LINEBot\Event\MessageEvent\TextMessage::__set_state(
array(
'message' =>
array (
'type' => 'text',
'id' => '10629983864837',
'text' => '這是一段文字',
),
'event' =>
array (
'type' => 'message',
'replyToken' => '773xxxxxx10044c9b52ac0b185145023',
'source' =>
array (
'userId' => 'Ubefxxxxxxbdc59b024344f4ce81e7911',
'type' => 'user',
)
)
'timestamp' => 1569403340191
)
),
)

 

此時 LINE 收到使用者的文字訊息後,會把這則文字訊息傳到我們剛剛給的 webhook 位址。我們把它印出來後,可以看到這個 JSON 是一個 webhook event object,此物件(events)包含 1 ~ n 個 event。先拿一個 event 來說明,從第一個先看:

'message' =>
array (
    'type' => 'text',
    'id' => '10629983864837',
    'text' => '這是一段文字',
),

 

message 這個區塊主要是描述使用者傳來的訊息,我們可以從 type 看出這段訊息的類型; id 可以看出這則訊息的唯一識別碼; text 會有使用者傳過來的訊息。

接著是第二個區塊:

'event' =>
array (
    'type' => 'message',
    'replyToken' => '773xxxxxx10044c9b52ac0b185145023',
    'source' =>
    array (
        'userId' => 'Ubefxxxxxxbdc59b024344f4ce81e7911',
        'type' => 'user',
    ),
)

 

這裡描述著使用者傳過來的事件資訊。 type 是這則訊息的類型。 replyToken 則是在回應此訊息使用,當程式要回應此訊息時須使用此 token,這個 token 的有效時間不一定,但是相當的短,所以要回覆的話要儘快。

再來是, source 的這個部分。這裡會描述 哪種人? 和 誰? 傳過來的訊息。 type 可以得知是群組傳的訊息?還是使用者傳的訊息?所以可能是 user 或者是 group ; userId 則是傳過來的使用者的 id ,假設是群組傳過來的話,將會是 groupId (若使用者有同意 official accounts terms of use ,則會再多一個屬性 userId)。

最後一個 :

'timestamp' => 1569403340191

 

這個很單純就是這則訊息的時間戳,採用 UNIX 時間,也就是從 UTC 1970 年 1 月 1 日 0 時 0 分 0 秒起到現在不考慮閏秒的總秒數。

先有一個 Line Messaging API account

首先我們必須要有一個 LINE 開發人員的帳號,因此我們先進去 LINE Developers 的後台,點選 Log in 即可以進入後台

img

首先,我們要先建立一個 privoder ,點擊 右上或是中下的Create New Provider ,都可以建立

img

進去後,只要填寫 Provider name 就可以了,至於 Provider name 就是 chatbot 供應商的名稱,這應該很好理解的

接著進入剛剛建立的 privoder 點選 Create new channel ,會看到三種 channel ,我們要開發的是 Messaging API ,所以就直接選取中間吧

img

接著就是填寫 chatbot 的基本資訊囉,填寫的資訊依序如下:

  • App icon: 就是機器人的大頭貼
  • App name: 機器人的名稱
  • App description: 簡單敘述一下這隻機器人是在做什麼的
  • Category: 機器人的分類
  • Subcategory: 機器人的子分類
  • Email address: 你的聯繫信箱
  • Privacy Policy URL: 選填項目,如果你有隱私條款的話
  • Terms Of Use URL: 選填項目,如果你有使用條款的話

填寫完成並且確認後,就創立了一隻全新的機器人囉!

接著來看看機器人裡面有什麼資訊

img

Channel ID

這是你這個機器人的 ID ,先記著,等等會用到

Channel secret

這是你這個機器人的 secret,有點像是密碼,也是先記著,等等會用到

Channel access token

也是專屬你的機器人的 token ,也是先記著,等等會用到

Use webhooks

每當用戶傳訊息給你的機器人的時候,其實都是發送一個請求到你的 webhooks ,所以這個地方一定要選取 Enabled ,機器人才知道要使用webhooks 喔

Webhook URL

如同剛剛說的,每當用戶傳訊息給你的機器人的時候,其實都是發送一個請求到你的 webhooks,所以要提供一個網址讓 LINE 知道這隻機器人的請求要發送到哪裡。還有這個 Webhook URL 一定要有 SSL ,也就是走 https 喔

Allow bot to join group chats

是否讓你的機器人可以被加入群組,如果關掉的話,使用者就不能隨意把你的機器人丟進群組囉

Auto-reply messages

是否要自動回應訊息,這個是 [email protected] 後台可以設定的自動回應訊息,我通常是把它關掉的

Greeting messages

當使用者加機器人好友後的問候訊息,也是可以在 [email protected] 後台做設定,我通常也是把它關掉的

QR code of your bot

就是你的機器人的 QR Code ,掃了可以加她好友

Basic ID

就是你的機器人的 ID ,可以透過這 ID 在 LINE 上面搜尋到你的機器人

Your user ID

對於聊天機器人而言,每個使用者都是獨一無二的,你也不例外,所以這邊會有一組你的 user ID

大概就是這樣

讓 LINE 可以連到你的本地端:ngrok

上一章,我有提到一個表單欄位 Webhook URL ,當我們還在開發的階段時候,還沒有一台主機去放我們的應用程式,也或許你會有,不過這不用擔心,最後的時候,我會提到怎麼部署。

在這,我們只要先可以在本地端開發,並且讓 LINE server 可以打到你的 Webhook URL 就好了,這邊提供一個很多人在使用的服務: ngrok

為什麼選擇用 ngrok 呢?就如同官網所說的

1Spend more time programming. One command for an instant, secure URL to your localhost server through any NAT or firewall.

簡言之就是讓你花更多時間專注在寫程式。ngrok 會為你的本地主機服務器提供一個即時,安全的 URL。

再換句話說,就是把你的 localhost 對應到 https://xxxxx.ngrok.com。(這邊的 xxxxx 會隨著每次打開 ngrok ,隨機配一組給你),這樣子做之後的好處顯而易見,也就是你只要把 webhook URL 填好,就可以在 localhost 上面測試了!

除此之外,使用上也非常的簡單。

  1. 首先先去 ngrok 官網 註冊帳號
  2. 註冊成功,應該會看到這樣的引導說明:
ngrok引導說明
  1. 根據你的作業系統環境下載 ngrok 到根目錄,或是你知道的地方
  2. 打開終端機,輸入 ./ngrok authtoken , 的部分,每個人都不一樣,所以造著 ngrok 的說明複製貼上就可以設定好 auth token
  3. 輸入 ./ngrok http 8000 ,因為 Laravel 預設的 port 是 8000 ,所以我這也就輸入 8000 ,如果你因為其他原因使用了其他的 port 的話,這邊也要記得改成其他的 port 喔
  4. 出現這樣的畫面,就是差不多快成功了
    ngrok引導說明
  5. 將 Forwarding 的網址複製(要複製到有 https 的喔,不然 LINE 會不給過),貼到 LINE Developer 後台的 webhook URL 這個欄位,即可完成!

接著下一章,會來教大家如何做第一個簡單的回覆!

我需要會人工智慧、機器學習才能做嗎?

不用!

一個厲害的聊天機器人會根據不同訊息做出不同的反應,會需要以下元素:

  1. 大數據
  2. 演算法
  3. 文字處理

透過大數據,大量的語料和聊天數據來建置聊天機器人的前置作業,讓聊天機器人會根據不同使用情況,提供不一樣的對應

演算法使聊天機器人普及的關鍵因素,透過演算法分析了解語句間的關聯、來找出相對應關聯性較高的回覆答案,做出相對正確的回應,也因此當語料的情況下,機器人會相對很笨,常常答非所問。

文字處理則是根據不同的自然語言,結構文法不同,所以資料處理的方式更是大相逕庭,相較於英文,中文難上許多

但是很多現有的聊天機器人,都是使用 關鍵字 回應,例如使用者說『早安』,機器人就會回『早安喔』,如果使用者胡亂輸入,機器人可能就會不予回應,或是比較好的 UX 會提示聽不懂。因此要做一個聊天機器人,其實可以不用會人工智慧、機器學習是沒問題的!

什麼是聊天機器人

聊天機器人(ChatBot)是經由對話或文字進行交談的一種電腦程式。

其實聊天機器人也不是最近的幾年才開始流行的,早在 1988 年 MIT 人工智慧實驗室就推出了 Eliza 。搭著近幾年,人工智慧和語意分析不斷演進,再加上網路社群平台積極的推廣,Chatbot 聊天機器人也就因此興盛起來。

聊天機器人 Chatbot 主要是利用電腦程式來跟使用者對話,現在的網路社群平台,會透過提供的 webhook 來接收使用者的訊息,如此一來就可以利用 chatbot 產生一個制式化的回應來回覆使用者。

現在的聊天機器人主要分為兩大類,一種比較偏向娛樂性質,像是卡米狗。另一種比較是任務性質,像是快速買早餐或是 TaxiGO 。有些聊天機器人會配上自然語言處理,但大多數的聊天機器人都只會擷取輸入的關鍵字,再從資料庫中找尋最合適的應答句。

在 LINE LIFF 應用上 debug – vConsole

LIFF

LINE Front-end Framework(LIFF)是在 LINE 中運行的Web應用程序的平台。

啟動 LIFF時,LIFF 應用程式可以從 LINE app 中獲取數據,例如: LINE 用戶 ID。 LIFF 應用程式也可以來為用戶發送消息的功能。

我自己的 LIFF 應用

像是在我的 MiKA 這隻 chatbot 中,活動和名片的創建,或者是 MiKA STORE就是用 LIFF 設計而成

Imgur

LIFF 本身的架構相當簡單,其實就是引入一個 JavaScript 文件,然後呼叫對應的函示就可以完成很多包裝好的功能,官方的文件跟範例程式碼都很詳細,可以自己參考看看:官方文件

開發的困難點

不過開發的過程很多時候需要在 LINE APP 上頭做操作,在電腦上開瀏覽器的開發人員工具是不會有效果的,例如說要取得 LINE user id ,在瀏覽器上就會取得空值。不過有些時候要 debug 又非得要這些開發人員工具的協助

使用 vConsole

vConsole 是騰訊所推出的一個開源專案,可以解決 LIFF 測試的問題,此一工具簡單來說就是將瀏覽器的開發者工具,透過前端的方式呈現出來,而且安裝非常之容易,只要將程式碼下載下來後,嵌入 LIFF 的頁面即可

<script src="path/to/vconsole.min.js"></script>
<script>
    // init vConsole
    var vConsole = new VConsole();
    console.log('Hello world');
</script>