# 輔助開發 LINE Flex 訊息的工具
大家好,我是做出「LINE 數位版名片」的 LINE API 專家均民。
在開發 LINE Flex 訊息的時候,透過官方 Flex Message Simulator (opens new window) 看到的結果,不一定跟手機上面顯示的相同,如果你想要在手機上面看到顯示結果,你可以考慮使用本文要分享的小工具喔!
本文會教你建立一個聊天機器人,只要你使用桌面版的 LINE 對它送出 JSON 字串,它就會嘗試使用 replyMessage 把資料送出,你就可以在手機版 iOS 和 Android 的 LINE 上面看到顯示結果!
廢話不多說,馬上試用看看吧!
加入好友: https://liff.line.me/1645278921-kWRPP32q/?accountId=736cebrk (opens new window)
由於後端採用 Google Cloud Function,為了避免用量過高被收錢,所以有鎖執行上限,如果無回應的話,可以考慮建立自己專用的機器人或是重新傳送訊息試試喔!
# 直接把 Message 回傳
加入聊天機器人好友後,請傳送以下的訊息:
{
"type": "text",
"text": "Hello world"
}
然後機器人應該就會直接回應一個純文字訊息:
同時你也可以在手機中看到結果:
Android | iOS |
---|---|
接下來我們來測試直接從 Flex Message Simulator (opens new window) 複製下來的輸出:
Android | iOS |
---|---|
# 顯示收到的 Event
如果你對它傳送其他內容,它就會把 Event 用 JSON 回傳喔!
# 原始碼
https://github.com/taichunmin/gcf-line-devbot (opens new window)
為了要節省後端伺服器的費用,所以這個聊天機器人是直接放在 Google Cloud Function 上面的,如果大家想要自己依樣畫葫蘆建立一個自己使用的機器人,你可以把這個原始碼的 index.js
和 package.json
放到 Cloud Function 上面就行囉!
1 | 2 |
---|---|
把程式放到 Cloud Function 上面以後,它就會給你一個 HTTPS 的網址,你就要去 LINE Developer Console 裡面把這個網址設定到 Webhook:
記得要在 webhook 後面加上自己機器人的 Access Token 喔!
# 後記
這是受到卡米哥 (opens new window)啟發而寫出來的工具,至於為什麼需要特別查看每個平台的顯示結果呢?因為有時候你會發現顯示出來的內容會有差異:
Android | iOS |
---|---|
有發現哪裡不太對勁嗎?大家來找碴吧!
# 相關連結
TIP
本文範例程式的原始碼授權為 MIT License。