9/7給工程 _ 建立程式分類檔案、新增自動回應(Flex MESSAGE)相關程式

# 9/7給工程 _ 建立程式分類檔案、新增自動回應(Flex MESSAGE)相關程式 ### Introduction - Flex MESSAGE是一個LINE訊息模板，能夠讓開發者透過JSON 的方式建立起漂亮的訊息樣式。 ![](https://i.imgur.com/UwicHjW.png) > 帳號參考資料 test帳號的 Channel access token ``` 823IJ0YpfoYtIdDHYELC6pv9bk9WCjBFpFqmI81XAF3tBx34ZgoYKL1qjlADSGnyrzx1DS6yQXiFd2jFvoZs5fci+arQcuuGKIcYXZiy3Uc5Oi1IeJgGxLNuveHtzCeyrmjWykT0WgOIy6AIhrqY5AdB04t89/1O/w1cDnyilFU= ``` test帳號的 Channel secret ``` ca900a2627b393b550f18cabea446bc1 ``` - Line bot其他相關資料補充 [Python ：Line bot SDK](https://ithelp.ithome.com.tw/articles/10278048) [LINE Messaging API SDK for Python](https://github.com/line/line-bot-sdk-python) [Python Chatbot開發](https://qiu-yan-ming.gitbook.io/python-chatbot/shi-yong-line-bot-sdk) --- ### 正式步驟 > 主要執行程式語言:python > Flex MESSAGE程式語言:JSON **一、建立&分類程式檔案名稱二、製作 Flex MESSAGE 至專案資料夾三、設定自動回覆 handle_message(自動回應)指令** --- ### 一、建立&分類程式檔案名稱 >檔案名稱、存放內容皆可更改、討論~ | 編號 | 檔案名稱 | 功能說明 | | ---- | ------------------ | -------------------- | | 1 | app.py | 進入 Line Bot 程式 | | 2 | linebot.routes.py | 設定 webhook url | | 3 | linebot.config.py | Line Bot 連接設定 | | 4 | richmenu.model.py | 設定圖文選單模型 | | 5 | message.model.py | 設定Flex MESSAGE模型 | | 6 | message.service.py | 處理及回傳訊息 | | 7 |linebot.image.png | Line Bot圖片素材 | --- ### 二、製作 Flex MESSAGE 至專案資料夾 - 新增Flex MESSAGE json檔至資料夾的語法需新增Flex MESSAG - [ ] 1.找工作(alt_text='找工作')、(alt_text='job01') - [ ] 2.求職準備(alt_text='求職準備')、(alt_text='prepare01') >此寫法就像查字典 dict 來包就好，引入的函數只需 linebot.models.FlexSendMessage 相對單純 >(下為範例模板) [參考資料](https://ithelp.ithome.com.tw/articles/10243224) ``` from linebot.models import FlexSendMessage flex_message = FlexSendMessage( alt_text='hello', # alt_text= 訊息顯示的名稱 contents={ #把JSON貼過來 } ) line_bot_api.reply_message(event.reply_token, flex_message) ``` --- - 需製作的Flex MESSAGE - [ ] 1.找工作(alt_text='找工作')、(alt_text='job01') - [ ] 2.求職準備(alt_text='求職準備')、(alt_text='prepare01') >如果alt_text可以用中文設定就用中文，不行的話再用英文，感謝! #### 1. Flex MESSAGE 找工作(alt_text='找工作')、(alt_text='job01') [FLEX MESSAGE SIMULATOR 線上模板製作](https://developers.line.biz/flex-simulator/) [Flex Message 相關資料](https://ithelp.ithome.com.tw/articles/10243334) > 樣式參考示意圖 ![](https://i.imgur.com/Kwz5esH.png) ``` { "type": "carousel", "contents": [ { "type": "bubble", "body": { "type": "box", "layout": "baseline", "contents": [ { "type": "text", "text": "北部💼各類職缺", "weight": "bold", "size": "xxl", "align": "center" } ], "offsetTop": "xs", "offsetStart": "xs", "offsetBottom": "xs", "offsetEnd": "xs", "borderWidth": "none", "cornerRadius": "none" }, "footer": { "type": "box", "layout": "vertical", "spacing": "md", "contents": [ { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "無經驗可月薪32K+", "uri": "http://1111.com.tw/190101/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "月薪40K+", "uri": "http://1111.com.tw/190102/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "年薪14個月", "uri": "http://1111.com.tw/190103/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "二度就業", "uri": "http://1111.com.tw/190104/" } }, { "type": "text", "text": "更多地區 →", "weight": "bold", "size": "md", "align": "end" } ], "flex": 0, "margin": "md" } }, { "type": "bubble", "body": { "type": "box", "layout": "baseline", "contents": [ { "type": "text", "text": "中部💼各類職缺", "weight": "bold", "size": "xxl", "align": "center" } ], "offsetTop": "xs", "offsetStart": "xs", "offsetBottom": "xs", "offsetEnd": "xs", "borderWidth": "none", "cornerRadius": "none" }, "footer": { "type": "box", "layout": "vertical", "spacing": "md", "contents": [ { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "無經驗可月薪32K+", "uri": "http://1111.com.tw/190105/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "月薪40K+", "uri": "http://1111.com.tw/190106/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "年薪14個月", "uri": "http://1111.com.tw/190107/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "二度就業", "uri": "http://1111.com.tw/190108/" } }, { "type": "text", "text": "更多地區 →", "weight": "bold", "size": "md", "align": "end" } ], "flex": 0, "margin": "md" } }, { "type": "bubble", "body": { "type": "box", "layout": "baseline", "contents": [ { "type": "text", "text": "南部💼各類職缺", "weight": "bold", "size": "xxl", "align": "center" } ], "offsetTop": "xs", "offsetStart": "xs", "offsetBottom": "xs", "offsetEnd": "xs", "borderWidth": "none", "cornerRadius": "none" }, "footer": { "type": "box", "layout": "vertical", "spacing": "md", "contents": [ { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "無經驗可月薪32K+", "uri": "http://1111.com.tw/190109/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "月薪40K+", "uri": "http://1111.com.tw/190110/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "年薪14個月", "uri": "http://1111.com.tw/190111/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "二度就業", "uri": "http://1111.com.tw/190112/" } }, { "type": "text", "text": "更多地區 →", "weight": "bold", "size": "md", "align": "end" } ], "flex": 0, "margin": "md" } }, { "type": "bubble", "body": { "type": "box", "layout": "baseline", "contents": [ { "type": "text", "text": "東部、離島💼各類職缺", "weight": "bold", "size": "xl", "align": "center", "offsetTop": "md" } ], "offsetTop": "xs", "offsetStart": "xs", "offsetBottom": "xs", "offsetEnd": "xs", "borderWidth": "none", "cornerRadius": "none" }, "footer": { "type": "box", "layout": "vertical", "spacing": "md", "contents": [ { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "無經驗可月薪32K+", "uri": "http://1111.com.tw/190113/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "月薪40K+", "uri": "http://1111.com.tw/190114/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "年薪14個月", "uri": "http://1111.com.tw/190115/" } }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "二度就業", "uri": "http://1111.com.tw/190116/" } }, { "type": "text", "text": ". ", "weight": "bold", "size": "md", "align": "end" } ], "flex": 0, "margin": "md" } } ] } ``` - 第一頁:北部💼各類職缺 | 名稱 | 類型 | 網址 | | ----------------- | ------ | ---- | | 無經驗可月薪32K+ | button |http://1111.com.tw/190101/| | 月薪 40K+ | button |http://1111.com.tw/190102/ | | 年薪14個月 | button |http://1111.com.tw/190103/ | | 二度就業 | button |http://1111.com.tw/190104/ | | 其他地區 → |text | 無 | - 第二頁:中部💼各類職缺 | 名稱 | 類型 | 網址 | | ----------------- | ------ | ---- | | 無經驗可月薪32K+ | button |http://1111.com.tw/190105/ | | 月薪 40K+ | button |http://1111.com.tw/190106/ | | 年薪14個月 | button |http://1111.com.tw/190107/ | | 二度就業 | button |http://1111.com.tw/190108/ | | 其他地區 → |text | 無 | - 第三頁:南部💼各類職缺 | 名稱 | 類型 | 網址 | | ----------------- | ------ | ---- | | 無經驗可月薪32K+ | button |http://1111.com.tw/190109/ | | 月薪 40K+ | button |http://1111.com.tw/1901010/ | | 年薪14個月 | button |http://1111.com.tw/190111/ | | 二度就業 | button |http://1111.com.tw/190112/ | | 其他地區 → |text | 無 | - 第四頁:東部、離島💼各類職缺 | 名稱 | 類型 | 網址 | | ----------------- | ------ | ---- | | 無經驗可月薪32K+ | button |http://1111.com.tw/190113/ | | 月薪 40K+ | button |http://1111.com.tw/190114/ | | 年薪14個月 | button |http://1111.com.tw/190115/ | | 二度就業 | button |http://1111.com.tw/190116/ | | . |text | 無 | #### 2. Flex MESSAGE 求職準備(alt_text='求職準備')、(alt_text='prepare01') ![](https://i.imgur.com/nFRl8tk.png) ``` from linebot.models import FlexSendMessage flex_message = FlexSendMessage( alt_text='求職準備', contents={ { "type": "carousel", "contents": [ { "type": "bubble", "footer": { "type": "box", "layout": "vertical", "spacing": "md", "contents": [ { "type": "text", "text": "✉ 面試 ✉", "size": "xxl", "weight": "bold", "align": "center", "gravity": "center" }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "各職務分享", "uri": "hhttp://1111.com.tw/190375/" }, "position": "relative", "margin": "sm" }, { "type": "button", "style": "secondary", "height": "sm", "action": { "type": "uri", "label": "各企業分享", "uri": "http://1111.com.tw/190376/" } }, { "type": "separator" }, { "type": "text", "text": "✎ 履歷 ✐", "size": "xxl", "weight": "bold", "align": "center", "gravity": "center" }, { "type": "button", "action": { "type": "uri", "label": "免費履歷健診", "uri": "http://1111.com.tw/190377/" }, "margin": "md", "height": "sm", "style": "secondary" }, { "type": "button", "action": { "type": "uri", "label": "各職務履歷範本", "uri": "http://1111.com.tw/190378/" }, "margin": "md", "height": "sm", "style": "secondary" } ], "flex": 0, "margin": "md" } } ] } } ) line_bot_api.reply_message(event.reply_token, flex_message) ``` - ✉ 面試經驗 ✉ | 名稱 | 類型 | 網址 | | ----------------- | ------ | ---- | | 各職務分享 | button |http://1111.com.tw/190375/ | |各企業分享 | button |http://1111.com.tw/190376/ | - ✎ 履歷相關 ✐ | 名稱 | 類型 | 網址 | | ----------------- | ------ | ---- | | 免費履歷健診 | button | http://1111.com.tw/190377/ | | 各職務履歷範本| button | http://1111.com.tw/190378/ | --- ### 三、新增自動回應handle_message指令至message.service.py專案資料夾 [參考資料](https://ithelp.ithome.com.tw/articles/10243334) >需先在專案資料夾最前面導入 json 套件 ``` import json ``` 模板>在 handle_message 中新增以下內容 >剛剛導入的 JSON檔 FlexMessage，在 python 中要傳送 Flex Message ，可以直接將 JSON 傳入到 FlexSendMessage 不過在 JSON 之前需要給一個 alt_text (是訊息顯示的預覽內容) ex:以關鍵字profile呼叫alt_text='profile' ``` if(message == 'profile'): # 這的'profile'= 呼叫訊息的關鍵字 FlexMessage = json.load(open('card.json','r',encoding='utf-8')) # 輸入FlexMessage存放處以及encoding line_bot_api.reply_message(reply_token, FlexSendMessage('profile',FlexMessage)) ``` 須設定handle_message的FlexMessage資料 | alt_text英文版| alt_text中文版 | 呼叫關鍵字 | | --------- | ------------| ------------| | job01 | 找工作 |找工作、求職、依地區找工作、地區職缺、求職懶人包| | prepare01 | 求職準備 |求職準備、面試、履歷 |

Syntax	Example	Reference
# Header	Header	基本排版
- Unordered List	Unordered List
1. Ordered List	Ordered List
- [ ] Todo List	Todo List
> Blockquote	Blockquote
Bold font	Bold font
Italics font	Italics font
~~Strikethrough~~	~~Strikethrough~~
19^th^	19^th
H~2~O	H₂O
++Inserted text++	Inserted text
==Marked text==	Marked text
[link text](https:// "title")	Link
![image alt](https:// "title")	Image
`Code`	`Code`	在筆記中貼入程式碼
```javascript var i = 0; ```	`var i = 0;`
:smile:		Emoji list
{%youtube youtube_id %}	Externals
$L^aT_eX$	L^aT_eX
:::info This is a alert area. :::	This is a alert area.