FB、Line、Slack 共用 chatbot 模板
透過共用模板，會將以下 json 轉成 FB、Line、Slack 各自的訊息格式。
使用方式
const {
transformToLineMessage,
transformToLineMessages,
transformToFacebookMessage,
transformToFacebookMessages,
transformToSlackMessages,
} = require('@chi0307/transform-chatbot-message');
let message = {
type: 'text',
text: 'Hello World!!',
};
// Facebook 訊息結構
let facebookMessage = transformToFacebookMessage(message);
let FacebookPushMessage = {
recipient: {
id: FB_SENDER_PSID,
},
message: facebookMessage,
};
// Line 訊息結構
let lineMessage = transformToLineMessage(message);
let LinePushMessage = {
to: LINE_USER_ID,
messages: [lineMessage],
};
// Line 訊息使用 flex
let lineMessage = transformToLineMessage(message, { flex: true });
let LinePushMessage = {
to: LINE_USER_ID,
messages: [lineMessage],
};
// Slack 訊息結構
let slackMessages = transformToSlackMessages([message]);
let slackPushMessage = {
token: SLACK_TOKEN,
channel: CHANNEL_ID,
blocks: slackMessages,
};Example
https://github.com/chi0307/transform-chatbot-message/tree/master/example
GUI
可搭配網頁產生 json
https://chi0307.github.io/side/chatbot-json-toolbox
文字訊息
{
"type": "text",
"text": String
}| 欄位 | 說明 | Line 限制 | FB 限制 | Slack 限制 |
|---|---|---|---|---|
| text | 文字訊息 | 5000 字元 | 2000 字元 | 3000 字元 |
圖片訊息
{
"type": "image",
"imageUrl": String,
"previewImageUrl": String
}| 欄位 | 說明 | Line 限制 | FB 限制 | Slack 限制 |
|---|---|---|---|---|
| imageUrl | 圖片網址 | 網址長度 1000 字元 HTTPS over TLS 1.2 or later JPEG or PNG Max file size: 10 MB |
Max file size: 25 MB fetched within 10 seconds |
網址長度 3000 字元 |
| previewImageUrl | 預覽圖片網址 | 網址長度 1000 字元 HTTPS over TLS 1.2 or later JPEG or PNG Max file size: 1 MB |
不適用 | 不適用 |
影片訊息
{
"type": "video",
"videoUrl": String,
"previewImageUrl": String
}| 欄位 | 說明 | Line 限制 | FB 限制 | Slack 限制 |
|---|---|---|---|---|
| videoUrl | 影片網址 | 網址長度 1000 字元 HTTPS over TLS 1.2 or later mp4 Max file size: 200 MB |
Max file size: 25 MB fetched within 75 seconds |
網址長度 3000 字元 |
| previewImageUrl | 影片縮圖網址 | 網址長度 1000 字元 HTTPS over TLS 1.2 or later JPEG or PNG Max file size: 1 MB |
不適用 | 不適用 |
- Slack 會用網址方式呈現影片訊息
聲音訊息
{
"type": "audio",
"audioUrl": String,
"duration": Number
}| 欄位 | 說明 | Line 限制 | FB 限制 | Slack 限制 |
|---|---|---|---|---|
| audioUrl | 聲音網址 | 網址長度 1000 字元 HTTPS over TLS 1.2 or later m4a Max file size: 200 MB |
Max file size: 25 MB fetched within 10 seconds |
網址長度 3000 字元 |
| duration | 聲音長度 | 聲音檔案長度 (milliseconds) | 不適用 | 不適用 |
- Slack 會用網址方式呈現聲音訊息
按鈕訊息
可以使用 flex 結構
{
"type": "button",
"altText": String,
"title"?: String,
"text": String,
"buttons": Array<Action>
}| 欄位 | 說明 | Line 限制 | FB 限制 | Slack 限制 |
|---|---|---|---|---|
| altText | 預覽文字訊息 | 400 字元 | 不適用 | 不適用 |
| title | 訊息標題 (Optional) | 40 字元 (Optional) | 不適用 | 150 字元 (Optional) |
| text | 訊息內文 | 160 字元 | 640 字元 | 3000 字元 |
| buttons | 按鈕事件陣列 | 最多 4 個 | 最多 3 個 | 最多 5 個 |
- Slack 會分解成不同的結構組合成按鈕訊息
輪播訊息
可以使用 flex 結構
{
"type": "carousel",
"altText": String,
"columns": Array<{
"title": String,
"text": String,
"imageUrl"?: String,
"buttons": Array<Action>,
}>
}| 欄位 | 說明 | Line 限制 | FB 限制 | Slack 限制 |
|---|---|---|---|---|
| altText | 預覽文字訊息 | 400 字元 | 不適用 | 不適用 |
| columns | 輪播陣列 | 最多 10 個 | 最多 10 個 | 無上限 |
| column.title | 單一區塊標題 | 40 字元 (Optional) | 80 字元 | 150 字元 |
| column.text | 單一區塊內文 | 120 字元 (no image or title) 60 字元 (message with an image or title) |
80 字元 (Optional) | 3000 字元 |
| column.imageUrl | 單一區塊圖片 (Optional) | 網址長度 1000 字元 HTTPS over TLS 1.2 or later JPEG or PNG Aspect ratio: 1:1.51 Max width: 1024px Max file size: 10 MB (Optional) |
(Optional) | (Optional) |
| column.buttons | 按鈕事件陣列 | 最多 3 個 | 最多 3 個 | 最多 5 個 |
- 如果 column.title 、 column.text 只填寫其中一個的時候，會自動填補到 Line text 與 FB title
- Slack 會分解成不同的結構組合成輪播訊息
按鈕事件
回覆訊息 (PostBack)
{
"type": "postback",
"title": String,
"data": String
}| 欄位 | 說明 |
|---|---|
| title | 按鈕文字與使用者顯示回傳文字 |
| data | 回覆內容，需使用 webhook 接收並處理 |
打開網頁 (Url)
{
"type": "url",
"title": String,
"url": String
}| 欄位 | 說明 |
|---|---|
| title | 按鈕文字 |
| url | 點擊後開啟網頁 |
打電話 (Phone)
{
"type": "phone",
"title": String,
"number": String
}| 欄位 | 說明 | 範例 |
|---|---|---|
| title | 按鈕文字 | |
| url | 點擊後打電話 電話格式必須是 +<COUNTRY_CODE><PHONE_NUMBER> |
+886912345678 |
