【n8n實戰教學】穿搭大師-打造穿搭助理 - Line Messaging API 整合 2

用 n8n 串接 LINE,讓穿搭大師 AI 直接在 LINE 上幫你評論穿搭!
嗨大家好,我是東!
上一集我們已經用 n8n chat trigger 預設的聊天室,把圖片傳給穿搭大師,並且在聊天室裡拿到 AI 的評論。這一集,我們要挑戰更進階的玩法——直接用 LINE 把圖片傳給 n8n 裡的穿搭大師,然後在 LINE 上收到回覆!
LINE 串接 n8n 的基本流程
首先,來複習一下 n8n 串接 LINE 的基本流程。當我們在 LINE 傳訊息(像是 HiHi),LINE 會透過 Webhook 把訊息傳給 n8n。這對於純文字訊息很簡單,但如果要傳圖片,流程就稍微複雜一點。
當你在 LINE 上傳圖片時,LINE 會把圖片轉成一個 ID,再透過 Webhook 傳給 n8n。n8n 拿到這個圖片 ID 後,還要再去打 LINE 的 API,帶上 Access Token,才能把真正的圖片抓下來。
n8n 節點設定重點
- 先在 n8n 新增 Webhook 節點,並把網址貼到 LINE Developers 的 Webhook 設定裡。
- 記得要讓 n8n 處於「Listen for Test Event」狀態,這樣 LINE 的驗證才會成功。
- 成功串接後,測試傳送圖片,n8n Output 裡會出現圖片的 ID。
- 用 httpRequest 節點,根據 LINE 官方文件的 API,把圖片 ID 換成真正的圖片檔案。
- 設定 Header Auth,帶上 Access Token,才能順利抓圖。
圖片評論流程
圖片抓下來後,還不能直接丟給 AI Agent。你需要把 Output 轉成特定格式(JSON),只保留 Shared Input(像是「幫我評論這張照片」),然後再傳給 AI Agent 節點。
AI Agent 回覆評論後,還要再用 httpRequest 節點,把評論內容回傳到 LINE 的對話窗。這裡要注意 Reply Token 的時效性,過期就會失敗,所以測試時要用最新的訊息。
實測與小技巧
整個流程跑通後,你就可以直接在 LINE 上傳穿搭照,AI 會自動回覆評論!過程中還有一些 n8n 的小技巧,比如 Pin Data 讓測試更方便,或是只保留必要的 JSON 欄位,讓流程更乾淨。
如果你想進一步了解多模態(圖片、聲音、影片等)資料怎麼給 AI 解析,也可以自己查查相關資料,這是現在 AI 很熱門的應用方向!
這次的分享就到這邊。如果你在串接過程中遇到問題,或對 n8n、LINE、AI 穿搭大師有興趣,歡迎留言討論。下次見,掰掰!
Http Request 節點
{
"replyToken": "{{ $('Webhook').first().json.body.events.last().replyToken }}",
"messages": [
{
"type": "text",
"text": "{{ $json.output.replaceAll('\n', '\\n') }}"
}
]
}
{{ $('Webhook').first().json.body.events.last().replyToken }}
- 從 Webhook 節點取得 replyToken。
{{ $json.output.replaceAll('\n', '\\n') }}
-replaceAll('\n', '\\n') 語法是為了讓 output JSON 可以正常顯示。