コンテンツにスキップ

Line Channel

実際の利用者がすでに LINE にいて、onboarding も LINE の中で完結させたいなら LINE channel を使います。

Codeer で LINE を live にするうえで本当に重要なのは Webhook URL と LIFF Entry URL です。LINE channel の Publish は主にメッセージ受信のオンオフを切り替える役割で、実際の返答は紐づけた Agent の最新の公開済みバージョンが返します。

始める前に必要なもの

  • 少なくとも一度 publish 済みの Agent
  • workspace の channel 編集権限
  • 次へのアクセス
    • LINE Official Account Manager
    • LINE Developers Console
  • 外部公開された HTTPS の Codeer 環境
  • 最初の認証テストに使う受信可能なメールアドレス

公開 HTTPS が必要な理由

LINE は、一般的なブラウザで信頼される証明書を持つ公開 HTTPS の webhook と LIFF エンドポイントしか受け付けません。Codeer の Webhook URL または LIFF 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 ID と LINE Login Channel ID を要求するため、今の対応構成は LINE Login channel に紐づく LIFF app です。

完全セットアップ手順

  1. 先に Codeer で LINE channel を作成し、二つの Codeer URL をコピーする

    • 先に Codeer の Editor で対象 Agent を publish します。
    • Channels を開きます。
    • New Channel を押します。
    • LINE Bot を選びます。
    • 安定した Name と Slug を設定します。
    • LINE channel の Configuration で次をコピーします。
      • Webhook URL
      • LIFF Entry URL
    • この時点では Codeer の LINE channel をまだ publish しません。先に LINE 側の設定を終えて、LINE の認証情報を Codeer に貼り戻してください。

  2. LINE Official Account を作成して Messaging API を有効化する

    • まず公式アカウントのホームを開く
      • この bot を所有している LINE Business アカウントで LINE Official Account Manager にサインインします。
      • エンドユーザーが友だち追加してメッセージを送る対象の公式アカウントを開きます。
      • 最初は設定画面ではなく、公式アカウントのホーム画面が表示されているはずです。

    LINE Official Account Manager の対象アカウントのホーム画面

    • アカウント設定に入る
      • 右上の Settings をクリックします。
      • 画面が Account settings に切り替わります。

    左側に設定メニューが表示されたアカウント設定画面

    • Messaging API ページを開く
      • 左側の設定メニューで Messaging API をクリックします。
      • まだ有効化していない場合、状態は Unused で、中央に緑色の Enable Messaging API ボタンが表示されます。

    Messaging API 有効化前の画面。中央に Enable Messaging API ボタンが表示される

    • Messaging API の有効化を開始する

      • Enable Messaging API をクリックします。
      • provider を選ぶダイアログが開きます。

    • Provider を慎重に選ぶ

      • 新しい provider を作成するか、既存の provider を選びます。
      • 自分のチーム用の bot であれば、provider 名は主に管理用です。分かりやすい名前で十分です。
      • 後で LINE Login channel を置く Provider が決まっているなら、この時点で必ず同じ Provider を選びます。
      • Agree をクリックして進みます。

    Messaging API 有効化時の Provider 選択ダイアログ

    • プライバシーポリシー URL と利用規約 URL は後回しでもよい
      • 次に LINE は Privacy policy URL と Service terms URL の入力を求めます。
      • まだそのページを用意していなければ、ここでは空欄のままで構いません。
      • この段階では必須ではなく、後から編集できます。
      • Confirm をクリックします。

    Privacy policy URL と Service terms URL の入力ダイアログ。ここでは空欄でも進められる

    • Messaging API 有効化を確定する
      • 最後に、公式アカウント名と provider 名を確認するダイアログが表示されます。
      • ここで provider が正しいかをもう一度確認してください。
      • もう一度 Confirm をクリックして有効化を完了します。

    Messaging API を有効化する前の最終確認ダイアログ

    • Codeer の webhook を貼り付けて保存する

      • 有効化が終わると、同じ Messaging API ページの状態が Unused から In use に変わります。
      • この時点で次が見えるはずです。
        • Channel ID
        • Channel secret
        • Webhook URL 入力欄
        • ページ下部の LINE Developers Console リンク
      • Codeer の Webhook URL を webhook 欄に貼り付けます。
      • Save をクリックします。

    • 次に 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 タブで、表示名が先ほど有効化した LINE Official Account と一致する Messaging API カードを探します。
      • 同じ 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 の Webhook URL に Codeer の 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 messages と Auto-reply messages を無効にしてください。そうしないと、LINE 標準のメッセージと Codeer の返答が両方見えることがあります。

  5. 同じ Provider に LINE Login channel を作成する

    LINE ログインやフォーム機能が必要なときだけ必要です

    この手順は、ユーザーに LINE 内でログインしてもらってメールアドレスを収集したい場合、または 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 を publish する

    新しく作った LINE Login channel は最初 Developing 状態です。この状態では admins と testers しか使えません。一般ユーザーにも LIFF 認証フローを使ってもらうなら、先に Published に変更してください。

  6. LINE Login channel に LIFF app を作成する

    • LIFF タブで新しい LIFF app を追加する

      • LINE Login channel の LIFF タブを開きます。
      • Add を押します。

    • LIFF app の基本情報を入力する

      • LIFF app name には分かりやすい名前を入れます。例: <Official Account Name> LIFF。
      • Size は Full にします。
      • Endpoint URL に Codeer の LIFF Entry URL を貼り付けます。

    Add a LIFF app フォーム。LIFF app name、Size、Endpoint URL を表示

    • scope と友だち追加オプションを選ぶ
      • openid をオンにします。
      • profile をオンにします。
      • 明確な理由がなければ、他の scope はオフのままにします。
      • Add friend option は On (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 内でメール認証ページやフォームフローを表示するための Web 画面です。LIFF がない、または Endpoint URL が間違っていると、bot を友だち追加できても LINE 内の認証フローを完了できません。

  7. Codeer で LINE 設定を完了する

    • LINE 側の値を Codeer に貼り戻す
      • Codeer の LINE フォームに戻ります。
      • まず次の値を Codeer に貼り付けます。
        • Channel Secret
        • Channel Access Token
      • LINE 内ログイン / メール収集や Request Form のために LINE Login と LIFF を作成した場合は、さらに次も貼り付けます。
        • LIFF ID
        • LINE Login Channel ID
      • LINE メッセージに応答する publish 済み Agent を選びます。
      • 設定を保存します。

    選択できるのは publish 済み Agent だけです

    Agent が一覧に出ない場合は、Editor に戻って publish してから、再度 LINE channel ページに戻ってください。

  8. Codeer の LINE channel を publish する

    • webhook、LIFF app、認証情報、Agent 紐づけの準備がすべて整ってから publish します。
    • 新しい LINE イベントの受信を止めたい時は Unpublish を使います。

最初の live テスト

広く共有する前に、実際の LINE アカウントで一度 end-to-end の確認をしてください。

  1. LINE Official Account を友だち追加します。

  2. 最初にメール認証カードが届くことを確認します。

  3. 実際のテキストメッセージを一つ送ります。

  4. LINE 内で LIFF ページを開きます。

  5. メールアドレスを入力し、メールに届いた 6 桁コードを送信します。

  6. もう一度メッセージを送り、正しい Agent が返答することを確認します。

  7. 会話が Histories に表示されることを確認します。

最初の AI 返答は認証後です

メール認証が終わるまでは、通常の Agent 返答ではなく onboarding カードが表示されます。最初のカードを見逃しても、未認証のまま再度メッセージを送ると同じ認証カードが表示されます。

LINE 内のフォーム依頼

Agent が Request Form を使う場合、Codeer は同じ LIFF app をそのまま再利用します。

想定フローは次の通りです。

  • ユーザーが LINE でフォームカードを受け取る
  • カードから LIFF 内の対象フォームが開く
  • ユーザーが送信または拒否する
  • 会話が同じ LINE thread で再開する

重要な挙動

  • Codeer の LINE channel が publish 済みでないと webhook はイベントを受け付けません。
  • その後の LINE 返答は、紐づけた Agent の最新の publish 済みバージョンを使います。
  • LINE 資格情報の保存や紐づけ先 Agent の変更は live 設定に即時反映されます。Publish は主に LINE イベント受信を許可するスイッチです。
  • LINE 側で Messaging API access token をローテーションしたら、同じ token をすぐ Codeer にも反映してください。

bot にメッセージできる人は誰でも認証フローを始められます

LINE channel を publish すると、その bot にメッセージを送れる LINE ユーザーは誰でも LIFF 認証フローを開けます。より厳密な pilot が必要なら、専用のテスト bot を使ってください。

トラブルシューティング

  1. Verify が失敗する、または bot がまったく応答しない

    • Codeer の Webhook URL が公開 HTTPS か確認します。
    • Use webhook が有効か確認します。
    • Channel Secret と Channel Access Token が同じ Messaging API channel のものか確認します。
    • Codeer の LINE channel 自体も publish 済みか確認します。

  2. LIFF ページは管理者には開くが一般ユーザーには開かない

    • LINE Login channel が Published で、Developing のままではないことを確認します。
    • その LIFF app が同じ LINE Login channel に属していることを確認します。

  3. LIFF は開くがメール認証に失敗する

    • 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 messages と Auto-reply messages を無効にします。
    • Official Account の設定保存後に再テストします。

  5. 認証コードは届くが連携を完了できない

    • コードの有効期限は 10 分です。
    • 再送は 60 秒ごとに制限されます。
    • 同じ workspace では、一つのメールアドレスを別の LINE identity に紐づけできません。

  6. published agent がないと言われる、または返答内容が違う

    • Editor で紐づけ済み Agent を publish します。
    • Codeer の LINE 設定で正しい Agent が選ばれているか確認します。

関連ガイド

LINE 公式リファレンス