สร้าง Line Chat Bot ตอบข้อความอัตโนมัติ ด้วย Node js

 

บทความนี้ผมจะพาท่านผู้อ่านมาสร้าง Line chat bot (Messaging API) โดยส่วนของการประมวลผมการตอบกลับนั้นจะใช้ Node js ในการทำงาน backend ในที่นี้เราจะเริ่มในส่วนของ Node js เลย ถ้าท่านผู้อ่านยังไม่เปิดการใช้งาน LINE Messaging API หรือ การติดตั้ง Node js สามารถคลิกอ่านได้เลยครับ

• สร้าง Line Chat Bot ด้วย Line Messaging API (การสมัคร)
  
• มาทำความรู้จัก และเริ่มต้นใช้งาน Node js

มาสร้าง web server โดย Node js กัน

1. ไปที่โฟลเดอร์โปรเจคของเรา กด shift พร้อม คลิกขวา เปิด Powershell

2. สร้างโปรเจค Node js พิมพ์คำสั่ง npm init -y จะได้ไฟล์ package.json

npm init -y

3. เพิ่มคำสั่ง "start": "node index.js" ใน  package.json

4. ติดตั้ง express package เพิ่มโดยพิมพ์คำสั่ง

npm add express #หรือ npm i express -save

เมื่อติดตั้งเสร็จ จะเห็นไฟล์ package.json มีส่วน dependencies ขึ้นมา และมีโฟลเดอร์ node_modules เกิดขึ้น

node_modules เป็นที่เก็บ package

5. สร้างไฟล์ index.js วางโค๊ด web server เข้าไป กด save 

const https = require("https")
const express = require("express")
const app = express()
const PORT = process.env.PORT || 3000 //

app.use(express.json())
app.use(express.urlencoded({
  extended: true
}))

app.get("/", (req, res) => {
  res.send('สวัสดี express')
})

app.listen(PORT, () => {
  console.log(`Example app listening at http://localhost:${PORT}`)
})

6. รันโปรแกรม npm start จากนั้นทดสอยโดยเปิดเว็บ http://localhost:3000/ จะเห็นข้อความตอบกลับมาตามที่ได้เขียนไว้

แต่ Messaging API จะส่ง Webhook ไปยัง web server ที่มี url เป็น https เท่านั้น developers.line.biz/en/reference/messaging-api/#webhooks

สร้าง Public URL เพื่อการทดสอบด้วย ngrok

ngrog คือ เครื่องมือที่ทำให้ web หรือ api ที่รับบน localhost สามารถ online และเข้าถึงจาก internet ได้ ngrok.com

1. เข้าไปสมัครลงชื่อใช้งานที่ dashboard.ngrok.com/login ผมเลือก Log in with Google สะดวกดี

2. เมื่อเข้าหน้า Dashboard ไปที่ Setup & Installation จากนั้นกด Download for Windows ได้เลย

3. เมื่อ Download เสร็จ แตกไฟล์(unzip) ไปที่เราต้องการ ในที่นี้ผมเอาไปไว้ที่โปรเจคเลย

4. เชื่อมต่อกับบัญชี ngrok ของเรา ไปเอา Authtoken ที่ Your Authtoken

5. จากนั้นรันคำสั่งเพื่อเชื่อมต่อ 

./ngrok authtoken 1ytqbGx1qvZ8NzuviLO2Qkiar

6. พร้อมแล้วรัน ngrok ได้เลย เปิด Pwershell อีกตัวแล้วรันคำสั่ง

./ngrok http 3000 #3000 คือ port ของ web server

7. เราก็จะได้ Public URL เอาไปทดสอบเรียกดูที่เว็บเบราว์เซอร์

ตอนนี้ Public URL พร้อมให้ LINE Messaging API ส่ง Webhook มาได้แล้ว

เชื่อมต่อ LINE Messaging API  กับ Node js Web API ของเรา

1. เอา ngrok URL/webhook ไปใส่ที่ช่อง Webhook URL ของ Channel > Messaging API

2. เพิ่มโค๊ด rout /webhook ใน index.js เอาค่าที LINE ส่งมาแสดง กดบันทึก แล้วรัน npm start ใหม่

const https = require("https")
const express = require("express")
const app = express()
const PORT = process.env.PORT || 3000 

app.use(express.json())
app.use(express.urlencoded({
  extended: true
}))

app.get("/", (req, res) => {
  res.send('สวัสดี express webhook')
})

app.post("/webhook", (req, res) => { // <============= เพิ่มเข้ามาใหม่
  console.log('req.body =>', JSON.stringify(req.body,null,2)) //สิ่งที่ Line ส่งมา
  res.send("HTTP POST request sent to the webhook URL!")
})

app.listen(PORT, () => {
  console.log(`Example app listening at http://localhost:${PORT}`)
})

})

3. ลองพิมพ์ใน chat  bot จะได้รับข้อมูลดังภาพ

4. คราวนี้เพิ่มโค๊ดให้มันตอบกลับ ใน index.js อย่าลืมไปเอา LINE Token มาด้วนะ

const https = require("https")
const express = require("express")
const app = express()
const PORT = process.env.PORT || 3000 //
const TOKEN = 'enter your channel access token here' // ============= เพิ่มเข้ามาใหม่

app.use(express.json())
app.use(express.urlencoded({
  extended: true
}))

app.get("/", (req, res) => {
  res.send('สวัสดี express webhook')
})

app.post("/webhook", (req, res) => {
  console.log('req.body =>', JSON.stringify(req.body,null,2)) //สิ่งที่ Line ส่งมา
  res.send("HTTP POST request sent to the webhook URL!")
 
   // ============= เพิ่มเข้ามาใหม่
  if (req.body.events[0].type === "message") {
    // Message data, must be stringified
    const dataString = JSON.stringify({
      replyToken: req.body.events[0].replyToken,
      messages: [
        {
          "type": "text",
          "text": "Hello, user"
        },
        {
          "type": "text",
          "text": "May I help you?"
        }
      ]
    })

    // Request header
    const headers = {
      "Content-Type": "application/json",
      "Authorization": "Bearer " + TOKEN
    }

    // Options to pass into the request
    const webhookOptions = {
      "hostname": "api.line.me",
      "path": "/v2/bot/message/reply",
      "method": "POST",
      "headers": headers,
      "body": dataString
    }

    // Define request
    const request = https.request(webhookOptions, (res) => {
      res.on("data", (d) => {
        process.stdout.write(d)
      })
    })

    // Handle error
    request.on("error", (err) => {
      console.error(err)
    })

    // Send data
    request.write(dataString)
    request.end()
  }
})

app.listen(PORT, () => {
  console.log(`Example app listening at http://localhost:${PORT}`)
})

5. ลองพิมพ์ข้อความใน chat  bot อีกรอบ ไช้โย! มันตอบกลับมาแล้ว

Official Document

•  (Tutorial) Make a sample reply bot using Node.js
•  Sending messages