LINE Messaging APIでwebhookを理解

LINE Messaging APIでwebhookを理解

投稿日: 2024年10月24日

Tips
要約
  • Webhookを通じてLINE Messaging APIを利用し、ユーザーとのインタラクションを実現する方法を学びました。
  • Webhookとは、外部サービスから指定したエンドポイントにHTTPリクエストを送る仕組みであると理解しました。
  • 今後はLINE Notifyを活用し、データベースにユーザー情報を登録するなどの応用を考えています。

はじめに

今までもwebhookという言葉はお見掛けすることがありましたが、なんとなく近寄りがたく仲良くなれる気がしていなかったのですが、絶対必要な感じのシーンが訪れたので今回やってみて理解しました。

外部連携する必要がある場合は結構役にたつかもと思ったので、アウトプットも兼ねて言語化してみようと思います。

備忘録みたいな感じですが。

Messaging APIとの出会い

先日LINE Notifyでグループ名を取得する記事を書きました。

その続編でLINE通知をするAPIを叩くところまできたため、いざエンドポイントどれやと公式ドキュメントを開くと

がーーーーーーーん。って感じでした。計画が完全に崩れまして。

まぁ外部APIを、無料で使えるというのはこういうことですよね。

気持ちを即きりかえて、じゃあどうするか考えねばとなったら親切に「Messaging API」を使えとあったので、全力でドキュメントを読みました。

わかったこと

公式に丁寧に書いてあるのでそれを読むのがいいのですが、ザっとまとめると

  • 公式アカウントから送信するから公式アカウントを作る必要がある
  • 指定したwebhookURLにWebhookイベントが送信される
  • webhookイベントを確認してLINEプラットフォーム経由でユーザーに応答する

つまりwebhookから逃げられないことがよく分かりました。

できることは、

  • 応答メッセージ送る
  • 任意のタイミングでメッセージ送る
  • ユーザーが送ったコンテンツを取得する

他にも色々ありましたが、私に関係ありそうなのはこんな感じかなと思いました。

webhookとは

そもそもwebhookとはなのですが、Wikipediaにこうあります。

webhook(ウェブフック)は、web開発でカスタムのコールバックを用いてウェブページウェブアプリケーションの動作を追加または変更するための方法である。

ちょっとわかりにく過ぎませんか。理解させる気の無さそうな説明だと感じました。

LINE Developersにはこうあります。(LINE Messaging APIのwebhookの説明)

ユーザーが、LINE公式アカウントを友だち追加したり、LINE公式アカウントにメッセージを送ったりすると、LINE Developersコンソールの「Webhook URL」に指定したURL(ボットサーバー)に対して、LINEプラットフォームからWebhookイベントオブジェクトを含むHTTP POSTリクエストが送られます。

ふむ。って感じですね。私が実装して理解したwebhookとは、

外部サービスから指定したエンドポイントにHTTPリクエストを送る(API叩く)こと

こう解釈したら解せたって感じでした。(同じこと言ってるだけやんって思ったらごめんなさいw)

今回は、LINE Messaging APIを使って、私が作っているwebアプリのプロジェクトファイル内で私が用意したエンドポイントにLINEの友だち登録されたタイミングやメッセージが送信されたタイミングでLINE側からPOSTリクエストを送ってもらう。って感じです。

やったこと

  1. 公式アカウント作る
  2. Messaging APIを有効にする
  3. エンドポイント用意する(methodはPOSTで)
  4. webhookのURLを指定し、有効にする(vercelデプロイしてURL確定させてからやりました)
import { NextRequest, NextResponse } from "next/server";

export const POST = async (req: NextRequest) => {
  try {
    //ここにやりたい処理書く
    return NextResponse.json(
      {
        message: "success",
      },
      { status: 200 }
    );
  } catch (e) {
    if (e instanceof Error) {
      return NextResponse.json({ error: e.message }, { status: 400 });
    }
  }
};

正しく処理出来たらstatusコードは200を返さないといけないです。

リクエストボディに色んな情報入っているので、公式ドキュメントで確認しながら型定義しました。(まだ途中ですが・・)

型とかも丁寧に全部書いてあります。

この中から自分が処理したいイベントかどうかを条件分岐しながらやっていくのかなと思います。

まだ処理はこれからですが、一旦webhookわかったと思ったのでここまで書いてみました。

これからやること

前に作成したLINE Notify使ってグループ名取得する方法ではいけないと察したので、やり方を考えます。

今のところはwebhookで友達追加されたタイミング(参加イベント)でデータベースにユーザーやグループ情報を登録して、

ユーザーに必要な情報を返す。(今回の場合は予定登録する画面のURLと合言葉)

このあたり使うんじゃないかなと思っています!!

他にやることあるので少しまた時間開く気がしますが・・supabaseの一時停止には気を付けようと思います。

おわりに

初めて扱うことになったwebhookでしたが、理解するとそんなに難しくない、大変便利な機能だなと思いました。

色んなサービスでwebhookあると思うので、これからは仲良くなれたらいいなと思っています!!

シェア!

Threads
user
吉本茜
山口在住/二児の母/育休中
Loading...
記事一覧に戻る
Threads
0