เชื่อมต่อ LINE API สำหรับนักพัฒนา: Messaging API, Login, LIFF

Provider "My Shop"
├── Messaging API channel   (ผูกกับ LINE Official Account)
├── LINE Login channel      (ล็อกอินเว็บ + LIFF apps)
└── LINE MINI App channel   (ถ้าต้องการ)

# .env
LINE_CHANNEL_ACCESS_TOKEN=...
LINE_CHANNEL_SECRET=...
LINE_LOGIN_CHANNEL_ID=...
LINE_LOGIN_CHANNEL_SECRET=...

// line-api.ts: client ขนาดเล็กสำหรับ Messaging API ด้วย fetch (Node.js 22 ขึ้นไป)
const API = "https://api.line.me/v2/bot"
const token = process.env.LINE_CHANNEL_ACCESS_TOKEN
if (!token) throw new Error("Set LINE_CHANNEL_ACCESS_TOKEN")

export type LineMessage = { type: string; [key: string]: unknown }

export class LineApiError extends Error {
  constructor(public status: number, public requestId: string | null, public body: string) {
    super(`LINE API ${status}: ${body}`)
  }
}

async function post(path: string, body: unknown, headers: Record<string, string> = {}) {
  const res = await fetch(`${API}${path}`, {
    method: "POST",
    headers: { "Content-Type": "application/json", Authorization: `Bearer ${token}`, ...headers },
    body: JSON.stringify(body),
  })
  if (!res.ok) throw new LineApiError(res.status, res.headers.get("x-line-request-id"), await res.text())
  return res.json() as Promise<{ sentMessages?: { id: string; quoteToken?: string }[] }>
}

// Reply: ใช้ replyToken จาก webhook event ส่งได้สูงสุด 5 ข้อความ และไม่นับโควตา
export function reply(replyToken: string, messages: LineMessage[]) {
  return post("/message/reply", { replyToken, messages })
}

// Push: ส่งถึงผู้ใช้ กลุ่ม หรือห้องแชท 1 แห่ง เมื่อส่งซ้ำให้ใช้ retryKey (UUID) เดิม
export function push(to: string, messages: LineMessage[], retryKey: string) {
  return post("/message/push", { to, messages }, { "X-Line-Retry-Key": retryKey })
}

// Multicast: สูงสุด 500 user ID ต่อ request
export function multicast(to: string[], messages: LineMessage[]) {
  if (to.length > 500) throw new Error("multicast accepts at most 500 user IDs")
  return post("/message/multicast", { to, messages })
}

import { randomUUID } from "node:crypto"
import { push, type LineMessage } from "./line-api.js"

const userId = "U0123456789abcdef0123456789abcdef"
const welcome: LineMessage[] = [
  {
    type: "text",
    text: "คำสั่งซื้อ #1042 จัดส่งแล้วค่ะ",
    quickReply: {
      items: [
        { type: "action", action: { type: "uri", label: "ติดตามพัสดุ", uri: "https://example.com/track/1042" } },
        { type: "action", action: { type: "message", label: "คุยกับเรา", text: "สอบถามเรื่องคำสั่งซื้อ #1042" } },
      ],
    },
  },
]
const retryKey = randomUUID()
const result = await push(userId, welcome, retryKey)
console.log(result.sentMessages?.map((m) => m.id))

{ "type": "text", "text": "สวัสดีค่ะ มีอะไรให้ช่วยไหมคะ" }

{
  "type": "image",
  "originalContentUrl": "https://example.com/photo.jpg",
  "previewImageUrl": "https://example.com/photo-preview.jpg"
}

{
  "type": "flex",
  "altText": "โปรสุดสัปดาห์: ลด 20%",
  "contents": {
    "type": "bubble",
    "hero": {
      "type": "image",
      "url": "https://example.com/promo.jpg",
      "size": "full",
      "aspectRatio": "20:13",
      "aspectMode": "cover"
    },
    "body": {
      "type": "box",
      "layout": "vertical",
      "contents": [
        { "type": "text", "text": "โปรสุดสัปดาห์", "weight": "bold", "size": "xl" },
        { "type": "text", "text": "เครื่องดื่มทุกเมนูลด 20% ถึงวันอาทิตย์", "wrap": true }
      ]
    },
    "footer": {
      "type": "box",
      "layout": "vertical",
      "contents": [
        {
          "type": "button",
          "style": "primary",
          "action": { "type": "uri", "label": "ดูเมนู", "uri": "https://example.com/menu" }
        }
      ]
    }
  }
}

// login.ts: ปุ่ม "เข้าสู่ระบบด้วย LINE" (authorization code flow + PKCE) บน Express 5
import express from "express"
import { createHash, randomBytes } from "node:crypto"

const CHANNEL_ID = process.env.LINE_LOGIN_CHANNEL_ID!
const CHANNEL_SECRET = process.env.LINE_LOGIN_CHANNEL_SECRET!
const REDIRECT_URI = "https://example.com/auth/line/callback" // ต้องตรงกับ Callback URL ที่ตั้งไว้ใน Console

const app = express()
// ที่เก็บชั่วคราวสำหรับเดโม ใน production ให้ใช้ session store หรือฐานข้อมูล
const pending = new Map<string, { nonce: string; codeVerifier: string }>()

function readCookie(header: string | undefined, name: string) {
  return header?.split(/;\s*/).find((c) => c.startsWith(`${name}=`))?.slice(name.length + 1)
}

app.get("/auth/line", (_req, res) => {
  const state = randomBytes(16).toString("hex")
  const nonce = randomBytes(16).toString("hex")
  const codeVerifier = randomBytes(32).toString("base64url") // ยาว 43 ตัวอักษร
  const codeChallenge = createHash("sha256").update(codeVerifier).digest("base64url")
  pending.set(state, { nonce, codeVerifier })
  res.cookie("line_state", state, { httpOnly: true, secure: true, sameSite: "lax", maxAge: 10 * 60 * 1000 })

  const params = new URLSearchParams({
    response_type: "code",
    client_id: CHANNEL_ID,
    redirect_uri: REDIRECT_URI,
    state,
    scope: "profile openid",
    nonce,
    code_challenge: codeChallenge,
    code_challenge_method: "S256",
  })
  // URLSearchParams แปลงช่องว่างเป็น "+" แต่ตัวอย่างของ LINE ใช้ %20
  res.redirect(`https://access.line.me/oauth2/v2.1/authorize?${params.toString().replaceAll("+", "%20")}`)
})

app.get("/auth/line/callback", async (req, res) => {
  const { code, state, error } = req.query
  const saved = typeof state === "string" ? pending.get(state) : undefined
  if (typeof state === "string") pending.delete(state)
  if (error || typeof code !== "string" || !saved || state !== readCookie(req.headers.cookie, "line_state")) {
    res.status(400).send("Login cancelled or invalid state") // ได้ error=ACCESS_DENIED เมื่อผู้ใช้กดไม่อนุญาต
    return
  }

  // 1. แลก code เป็น token
  const tokenRes = await fetch("https://api.line.me/oauth2/v2.1/token", {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: new URLSearchParams({
      grant_type: "authorization_code",
      code,
      redirect_uri: REDIRECT_URI,
      client_id: CHANNEL_ID,
      client_secret: CHANNEL_SECRET,
      code_verifier: saved.codeVerifier,
    }),
  })
  if (!tokenRes.ok) {
    res.status(502).send("Token exchange failed")
    return
  }
  const { access_token, id_token } = (await tokenRes.json()) as { access_token: string; id_token: string }

  // 2. ให้ LINE ตรวจ ID token (ลายเซ็น, channel ID, วันหมดอายุ, nonce)
  const verifyRes = await fetch("https://api.line.me/oauth2/v2.1/verify", {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: new URLSearchParams({ id_token, client_id: CHANNEL_ID, nonce: saved.nonce }),
  })
  if (!verifyRes.ok) {
    res.status(401).send("Invalid ID token")
    return
  }
  const claims = (await verifyRes.json()) as { sub: string; name?: string; picture?: string }

  // 3. (ไม่บังคับ) ดึงโปรไฟล์ล่าสุดด้วย access token
  const profile = await fetch("https://api.line.me/v2/profile", {
    headers: { Authorization: `Bearer ${access_token}` },
  }).then((r) => r.json() as Promise<{ userId: string; displayName: string; pictureUrl?: string }>)

  // claims.sub คือ LINE user ID ของผู้ใช้ภายใต้ provider ของคุณ สร้าง session ตรงนี้
  console.log(claims.sub, profile.displayName)
  res.redirect("/")
})

app.listen(3000)

// LIFF app (ฝั่งเบราว์เซอร์): ขอ ID token แล้วส่งให้เซิร์ฟเวอร์ตรวจ
import liff from "@line/liff"

await liff.init({ liffId: "1234567890-AbcdEfgh" })
if (!liff.isLoggedIn()) {
  liff.login() // ใช้ในเบราว์เซอร์ภายนอก ส่วนใน LIFF browser ผู้ใช้ล็อกอินอยู่แล้ว
} else {
  const idToken = liff.getIDToken() // ต้องเปิด scope openid
  await fetch("/api/me", { method: "POST", headers: { Authorization: `Bearer ${idToken}` } })
}

// webhook.ts: รับ event โดยไม่ใช้ SDK (Express 5)
import express from "express"
import { createHmac, timingSafeEqual } from "node:crypto"
import { reply } from "./line-api.js"

const CHANNEL_SECRET = process.env.LINE_CHANNEL_SECRET!
const app = express()

function isValidSignature(rawBody: Buffer, signature: string | undefined) {
  if (!signature) return false
  const expected = createHmac("sha256", CHANNEL_SECRET).update(rawBody).digest()
  const received = Buffer.from(signature, "base64")
  return received.length === expected.length && timingSafeEqual(received, expected)
}

type LineEvent = {
  type: string
  webhookEventId: string
  deliveryContext: { isRedelivery: boolean }
  replyToken?: string
  source?: { type: string; userId?: string; groupId?: string; roomId?: string }
  message?: { id: string; type: string; text?: string }
  postback?: { data: string }
}

// express.raw เก็บ byte ตามที่ LINE เซ็นไว้ทุกตัว ห้ามใช้ express.json() กับ route นี้
app.post("/webhook", express.raw({ type: "application/json" }), (req, res) => {
  const rawBody = req.body
  if (!Buffer.isBuffer(rawBody) || !isValidSignature(rawBody, req.get("x-line-signature"))) {
    res.sendStatus(401)
    return
  }
  const { events } = JSON.parse(rawBody.toString("utf8")) as { events: LineEvent[] }
  res.sendStatus(200) // ตอบให้เร็ว รวมถึงตอนที่ events เป็น [] (LINE ทดสอบการเชื่อมต่อ)
  for (const event of events) handleEvent(event).catch((err) => console.error(err))
})

const seen = new Set<string>() // ใน production ให้ใช้ Redis หรือฐานข้อมูลที่มี TTL

async function handleEvent(event: LineEvent) {
  if (seen.has(event.webhookEventId)) return // event ที่ส่งซ้ำหรือซ้ำกัน
  seen.add(event.webhookEventId)

  switch (event.type) {
    case "message":
      if (event.replyToken && event.message?.type === "text") {
        await reply(event.replyToken, [{ type: "text", text: `คุณพิมพ์ว่า: ${event.message.text}` }])
      }
      break
    case "follow":
      if (event.replyToken) await reply(event.replyToken, [{ type: "text", text: "ขอบคุณที่เพิ่มเราเป็นเพื่อนค่ะ" }])
      break
    case "postback": {
      const data = new URLSearchParams(event.postback?.data) // เช่น "action=book&slot=10:00"
      console.log("postback", data.get("action"), data.get("slot"))
      break
    }
    case "unfollow":
      // ไม่มี reply token: ผู้ใช้บล็อกบัญชีแล้ว หยุดส่งถึง event.source?.userId
      break
  }
}

app.listen(Number(process.env.PORT ?? 3000))

# app.py: webhook เดียวกันในภาษา Python ด้วย line-bot-sdk v3 (Python 3.10 ขึ้นไป)
import os
from flask import Flask, request, abort
from linebot.v3 import WebhookHandler
from linebot.v3.exceptions import InvalidSignatureError
from linebot.v3.messaging import (
    ApiClient, Configuration, MessagingApi, ReplyMessageRequest, TextMessage,
)
from linebot.v3.webhooks import FollowEvent, MessageEvent, TextMessageContent

app = Flask(__name__)
configuration = Configuration(access_token=os.environ["LINE_CHANNEL_ACCESS_TOKEN"])
handler = WebhookHandler(os.environ["LINE_CHANNEL_SECRET"])


@app.post("/webhook")
def webhook():
    signature = request.headers.get("X-Line-Signature", "")
    body = request.get_data(as_text=True)  # body ดิบ ก่อนแปลงเป็น JSON
    try:
        handler.handle(body, signature)
    except InvalidSignatureError:
        abort(401)
    return "OK"


@handler.add(MessageEvent, message=TextMessageContent)
def on_text(event):
    with ApiClient(configuration) as api_client:
        MessagingApi(api_client).reply_message(
            ReplyMessageRequest(
                reply_token=event.reply_token,
                messages=[TextMessage(text=f"คุณพิมพ์ว่า: {event.message.text}")],
            )
        )


@handler.add(FollowEvent)
def on_follow(event):
    with ApiClient(configuration) as api_client:
        MessagingApi(api_client).reply_message(
            ReplyMessageRequest(
                reply_token=event.reply_token,
                messages=[TextMessage(text="ขอบคุณที่เพิ่มเราเป็นเพื่อนค่ะ")],
            )
        )

import { randomUUID } from "node:crypto"
import { LineApiError, push, type LineMessage } from "./line-api.js"

export async function pushWithRetry(to: string, messages: LineMessage[], attempts = 3) {
  const retryKey = randomUUID() // ใช้ key เดิมทุกครั้งที่ลองใหม่
  for (let attempt = 1; ; attempt++) {
    try {
      return await push(to, messages, retryKey)
    } catch (err) {
      if (err instanceof LineApiError && err.status === 409) return // LINE รับไปแล้วตั้งแต่ครั้งก่อน
      const retryable = !(err instanceof LineApiError) || err.status === 429 || err.status >= 500
      if (!retryable || attempt >= attempts) throw err
      await new Promise((resolve) => setTimeout(resolve, 2 ** attempt * 1000))
    }
  }
}