跳轉到

Line Channel

當真正要服務的人本來就習慣在 LINE 上互動,而且你希望 onboarding 也在 LINE 裡完成時,就用 LINE channel。

對 Codeer 來說,LINE 上線時真正重要的入口是 Webhook URLLIFF Entry URL。在 LINE channel 上按 Publish,主要是在控制是否開始接收 LINE 訊息;實際回覆仍然來自目前綁定 Agent 的最新已發布版本。

開始前要先有什麼

  • 一個至少發布過一次的 Agent
  • workspace 的 channel 編輯權限
  • 可使用:
    • LINE Official Account Manager
    • LINE Developers Console
  • 一個可被外網存取的 HTTPS Codeer 環境
  • 一個可收信的 Email 信箱,用來做第一次驗證測試

為什麼一定要公開 HTTPS

LINE 只接受公開 HTTPS、且憑證受一般瀏覽器信任的 webhook 與 LIFF 入口。如果 Codeer 顯示的 Webhook URLLIFF Entry URL 無法從外網連到,設定會在 verify 那一步失敗。

你在 LINE 端會建立什麼

  1. 一個 LINE Official Account

  2. 在這個官方帳號上啟用 Messaging API

  3. 一個出現在 LINE Developers Console 的 Messaging API channel

  4. 同一個 Provider 底下的一個 LINE Login channel

  5. 掛在這個 LINE Login channel 上的一個 LIFF app

Messaging API 和 LINE Login 要放在同一個 Provider

Codeer 預期 Messaging API channel、LINE Login channel 與 LIFF app 都屬於同一個 LINE Provider。LINE 的使用者 ID 也是以 Provider 為單位區分,而且 channel 建好之後不能再搬到別的 Provider。

Codeer 目前仍使用 LINE Login 加 LIFF 的做法

LINE 現在在很多新流程裡都建議把新的 LIFF app 做成 LINE MINI App。Codeer 目前的 LINE 整合仍然要求 LIFF IDLINE Login Channel ID,所以目前支援的做法仍是 LINE Login channel 加 LIFF app。

完整設定流程

  1. 先在 Codeer 建立 LINE channel,並複製兩個 Codeer URL

    • 先在 Codeer 的 Editor 發布目標 Agent。
    • 打開 Channels
    • New Channel
    • 選擇 LINE Bot
    • 為這個 channel 設定穩定的 NameSlug
    • 在 LINE channel 的 Configuration 複製:
      • Webhook URL
      • LIFF Entry URL
    • 這個階段先不要發布 Codeer 的 LINE channel。先把 LINE 端設定完成,再把 LINE 憑證貼回 Codeer。
  2. 建立 LINE 官方帳號並啟用 Messaging API

    • 先打開官方帳號首頁
      • 用擁有這個 bot 的 LINE Business 帳號登入 LINE Official Account Manager。
      • 打開你要給最終使用者加好友與傳訊息的官方帳號。
      • 這時你應該會先看到官方帳號首頁,不是設定頁。

    LINE Official Account Manager 官方帳號首頁

    • 進入帳號設定
      • 點右上角的 設定
      • 頁面會切到 帳號設定

    LINE Official Account 設定頁,左側可見設定選單

    • 打開 Messaging API 頁面
      • 在左側設定選單裡點 Messaging API
      • 如果還沒啟用,畫面會顯示狀態 未使用,中間有一個綠色的 啟用 Messaging API 按鈕。

    Messaging API 尚未啟用時的頁面,中央會出現啟用按鈕

    • 開始啟用 Messaging API

      • 啟用 Messaging API
      • 接著會跳出 provider 選擇視窗。
    • 仔細選擇 Provider

      • 你可以建立新的 provider,或直接選現有的 provider。
      • 如果這個 bot 是你自己團隊在用,provider 名稱主要只是管理用途,取一個容易辨識的名字即可。
      • 如果你已經知道之後 LINE Login channel 會放在哪個 Provider,這裡就要選同一個 Provider。
      • 同意 繼續。

    啟用 Messaging API 時的 Provider 選擇視窗

    • 隱私權政策與服務條款可以先留空
      • LINE 接著會要求你填 Privacy policy URLService terms URL
      • 如果你現在還沒有這兩個頁面,可以先留空。
      • 這兩個欄位在這個階段是可選的,之後還可以再補。
      • 確定

    隱私權政策與服務條款 URL 視窗,這一步可以先留空

    • 確認啟用 Messaging API
      • LINE 會再跳出最後一個確認視窗,顯示官方帳號名稱與 provider 名稱。
      • 在這一步再確認一次 Provider 是否正確。
      • 再按一次 確定 完成啟用。

    啟用 Messaging API 前的最後確認視窗

    • 把 Codeer 的 webhook 貼上並儲存

      • 啟用完成後,同一個 Messaging API 頁面會從 未使用 變成 使用中
      • 這時你應該會看到:
        • Channel ID
        • Channel secret
        • 一個 Webhook URL 欄位
        • 頁面下方的 LINE Developers Console 連結
      • 把 Codeer 的 Webhook URL 貼到 webhook 欄位。
      • 儲存
    • 接著進到 LINE Developers Console

      • 點這個頁面上的 LINE Developers Console 連結。
      • 確認同一個 Provider 底下已經出現對應的 Messaging API channel
      • 後面建立 LINE Login channel 與 LIFF 時,也要繼續使用這個同一個 Provider。

    Messaging API 啟用完成後的頁面,可看到 Channel ID、Channel secret、webhook 欄位與 LINE Developers Console 連結

    這個流程在 2024-09-04 之後改了

    Messaging API channel 已不能直接從 LINE Developers Console 建立。現在的流程是先從 LINE Official Account Manager 開始,再回到 LINE Developers Console 完成設定。

  3. 在 LINE Developers Console 打開正確的 Messaging API channel

    • 進入同一個 Provider
      • 在 LINE Developers Console 中,留在剛剛啟用 Messaging API 時所選的同一個 Provider。
      • Channels 分頁找到那張 Messaging API 卡片,而且它的顯示名稱要和你剛剛啟用的 LINE Official Account 一致。
      • 不要因為它們都在同一個 Provider 裡,就隨便點另一張 Messaging API 卡片。Channel Secret、access token、webhook 和 LINE Official Account 必須全部來自同一個 channel。

    LINE Developers Console 的 Provider 頁面,顯示要打開的 Messaging API channel 卡片

    • 複製 Messaging API 的 Channel Secret
      • 點進正確的 Messaging API channel 卡片。
      • 打開 Basic settings
      • 往下找到 Channel secret
      • 複製 Channel secret。稍後會貼回 Codeer。

    Messaging API channel 的 Basic settings 頁面,顯示 Channel secret 的位置

  4. 設定 Messaging API channel

    • 打開 Messaging API 分頁並完成 webhook 設定
      • 回到同一個 Messaging API channel。
      • 打開 Messaging API 分頁。
      • Webhook settings 確認 Codeer 的 Webhook URL 已經貼在 Webhook URL 欄位中;如果還沒貼,就在這一步補上。
      • 打開 Use webhook
      • 打開 Webhook redelivery
      • 打開 Error statistics aggregation

    Messaging API 分頁,顯示 Webhook URL、Use webhook、Webhook redelivery 與 Error statistics aggregation

    • 建立長效 access token
      • 往下捲到 Channel access token 區塊。
      • Channel access token (long-lived) 旁邊按 Issue
      • 複製新產生的 token,稍後貼回 Codeer。

    Messaging API 分頁中的 Channel access token 區塊與 Issue 按鈕

    測試時先避免雙重回覆

    如果你希望使用者只看到 Codeer 的回覆,請到 LINE Official Account Manager 關掉 Greeting messagesAuto-reply messages。不然使用者可能同時收到 LINE 內建訊息和 Codeer 的回覆。

  5. 在同一個 Provider 下建立 LINE Login channel

    只有需要 LINE 內登入或表單流程時才需要

    這一步只有在你要讓使用者在 LINE 內登入並收集 Email,或是要使用 Request Form 時才需要。這些流程會依賴 LINE Login 加 LIFF。

    • 回到 Provider 的 channel 清單
      • 在 LINE Developers Console 重新打開同一個 Provider。
      • Channels 分頁按 Create a new channel

    Provider 頁面上可看到 Create a new channel 的位置

    • 選擇 LINE Login
      • 在 channel 類型選擇視窗中,選 LINE Login

    Create a new channel 視窗中選擇 LINE Login

    • 建立 LINE Login channel
      • LINE 會打開建立 channel 的表單。
      • 名稱請用容易看出和同一個 bot 有關的格式,例如 <Official Account Name> LIFF
      • App types 要包含 Web app
      • 把必填欄位填完並建立 channel。
      • 建立完成後,打開它的 Basic settings,複製 Channel ID。稍後會貼到 Codeer 的 LINE Login Channel ID

    正式給一般使用者測試前,要先把 LINE Login channel 發布

    新建立的 LINE Login channel 預設是 Developing。在這個狀態下,只有 admins 和 testers 可以使用。如果你要讓一般使用者也能完成 LIFF 驗證流程,必須先把 LINE Login channel 改成 Published

  6. 在 LINE Login channel 建立 LIFF app

    • 打開 LIFF 分頁並新增 LIFF app

      • 在 LINE Login channel 打開 LIFF 分頁。
      • Add
    • 填寫 LIFF app 的基本資訊

      • LIFF app name 用一個容易辨識的名稱,例如 <Official Account Name> LIFF
      • SizeFull
      • 把 Codeer 的 LIFF Entry URL 貼到 Endpoint URL

    Add a LIFF app 表單,顯示 LIFF app name、Size 與 Endpoint URL 欄位

    • 選 scope 與加好友選項
      • 打開 openid
      • 打開 profile
      • 除非你有明確需求,其他 scope 先不要開。
      • Add friend optionOn (Normal)
      • 建立 LIFF app。

    Add a LIFF app 表單,顯示 openid、profile 與 Add friend option 的設定

    • 複製 LIFF ID
      • LIFF app 建立完成後,到 LIFF app 清單複製 LIFF ID

    LIFF app 清單頁面,顯示 LIFF ID 的位置

    LIFF 在這裡的用途

    LIFF 是 Codeer 在 LINE 內用來呈現 Email 驗證頁與表單流程的 Web 入口。如果 LIFF 沒建好,或是 Endpoint URL 指錯,使用者就算成功加好友,也無法完成 LINE 內的驗證流程。

  7. 回到 Codeer 完成 LINE 設定

    • 把 LINE 端資料貼回 Codeer
      • 回到 Codeer 的 LINE 表單。
      • 先把這些值貼回 Codeer:
        • Channel Secret
        • Channel Access Token
      • 如果你有為 LINE 內登入 / 收集 Email 或 Request Form 建立 LINE Login 與 LIFF,再補上:
        • LIFF ID
        • LINE Login Channel ID
      • 選擇負責回覆 LINE 訊息的已發布 Agent。
      • 儲存設定。

    下拉選單只會出現已發布的 Agent

    如果你在這裡找不到 Agent,先回到 Editor 發布它,再回到 LINE channel 頁面。

  8. 發布 Codeer 的 LINE channel

    • webhook、LIFF app、憑證與 Agent 綁定都完成後,再發布 channel。
    • 如果你想先停止接收新的 LINE 事件,就用 Unpublish

第一次 live 測試

正式分享給更多人之前,先用一個真實 LINE 帳號跑完一次完整流程。

  1. 把 LINE 官方帳號加為好友。

  2. 確認使用者先收到 Email 驗證卡片。

  3. 送出一則真實文字訊息。

  4. 在 LINE 裡打開 LIFF 頁面。

  5. 輸入 Email,並送出信件中的六位數驗證碼。

  6. 再送一次訊息,確認是正確的 Agent 在回覆。

  7. 確認對話有出現在 Histories

第一則 AI 回覆會在驗證完成後才出現

在 Email 驗證完成前,使用者看到的是 onboarding 卡片,不是一般的 Agent 回答。如果一開始跳過卡片,之後在未驗證狀態下送訊息,還是會再次看到同一張驗證卡片。

LINE 裡的表單請求

如果 Agent 有使用 Request Form,Codeer 會重用同一個 LIFF app。

預期流程是:

  • 使用者在 LINE 收到一張表單卡片
  • 卡片會在 LIFF 裡打開指定表單
  • 使用者送出或拒絕表單
  • 對話會在同一個 LINE thread 裡繼續往下走

重要行為

  • Codeer 裡的 LINE channel 必須先是發布狀態,webhook 才會接受事件。
  • 後續的 LINE 回覆會使用目前綁定 Agent 的最新已發布版本。
  • 儲存 LINE 憑證或切換綁定 Agent 後,live 設定會立即更新;Publish 主要是在控制是否讓 LINE 事件進來。
  • 如果你在 LINE 那邊輪替了 Messaging API access token,也要立刻把同一個 token 更新到 Codeer。

只要能傳訊息給 bot,就能開始驗證流程

LINE channel 一旦發布,任何能傳訊息給這個 bot 的 LINE 使用者,都可以打開 LIFF 驗證流程。如果你要做更受控的 pilot,請考慮使用獨立的測試 bot。

疑難排解

  1. Verify 按鈕失敗,或 bot 完全沒有反應

    • 確認 Codeer 的 Webhook URL 是公開 HTTPS。
    • 確認 Use webhook 已啟用。
    • 確認 Channel SecretChannel Access Token 來自同一個 Messaging API channel。
    • 確認 Codeer 裡的 LINE channel 本身也已發布。
  2. LIFF 頁面管理員打得開,但一般使用者打不開

    • 確認 LINE Login channel 是 Published,不是 Developing
    • 確認這個 LIFF app 就屬於該 LINE Login channel。
  3. LIFF 打得開,但 Email 驗證失敗

    • 確認 LIFF app 的入口 URL 和 Codeer 顯示的 LIFF Entry URL 完全一致。
    • 確認 Codeer 裡的 LINE Login Channel ID,就是擁有該 LIFF app 的 LINE Login channel Channel ID
    • 如果頁面說 LINE ID token 缺失或過期,請從 LINE 內重新打開一次頁面。
  4. 使用者收到奇怪的歡迎詞或重複回覆

    • 到 LINE Official Account Manager 關掉 Greeting messagesAuto-reply messages
    • 儲存官方帳號設定後再重新測試。
  5. 收得到驗證碼,但無法完成綁定

    • 驗證碼 10 分鐘後會過期。
    • 重新寄送有 60 秒限制。
    • 同一個 workspace 中,一個 Email 不能綁到另一個不同的 LINE 身分。
  6. bot 說沒有已發布 Agent,或回答內容不對

    • Editor 發布目前綁定的 Agent。
    • 回到 Codeer 的 LINE 設定,確認綁定的是正確 Agent。

相關指南

LINE 官方參考文件