การใช้งานข้อความตอบกลับแชท (แชทบอท) ด้วย API

คลังข้อมูลบริการลูกค้า - Oho Chat help center / สำหรับนักพัฒนา / การใช้งานข้อความตอบกลับแชท (แชทบอท) ด้วย API

บน Oho Chat ผู้ใช้งานสามารถตั้งค่าข้อความตอบกลับแชท โดยให้ระบบไปดึงรูปแบบการตอบกลับจาก API ได้ โดยจะต้องมีรูปแบบข้อมูลตามที่ Oho Chat กำหนด

เนื้อหาในหน้านี้

วิธีการตั้งค่า
รูปแบบของไฟล์ JSON
Messages payload
รูปแบบ JSON body ของการตอบกลับรูปแบบข้อความ
รูปแบบ JSON body ของการตอบกลับรูปแบบรูปภาพ, ไฟล์
รูปแบบ JSON body ของการตอบกลับรูปแบบการ์ด carousel
Quick replies payload
รูปแบบ JSON body ของการตอบกลับรูปปุ่มข้อความ
วิธีการคัดลอก ID ของข้อความตอบกลับแชท
ตัวอย่างรูปแบบไฟล์ JSON

วิธีการตั้งค่า

เข้าสู่หน้าข้อความตอบกลับแชทที่ต้องการตั้งค่า โดยการคลิกปุ่ม แชทบอท ทางซ้ายมือ → เลือกแท็บ ตอบกลับแชท → เลือกข้อความตอบกลับแชทที่ต้องการ
ตั้งค่าเงื่อนไขการทำงานและรูปแบบการตรวจจับ
เลือกแท็บ API บริเวณการตอบกลับ แล้วคลิกปุ่ม แก้ไข
กรอก URL ของ API ที่ต้องการให้ทาง Oho Chat ไปดึงข้อมูล *จำเป็น

ในส่วนนี้ผู้ใช้งานสามารถแนบตัวแปรได้ดังนี้

ข้อความจากลูกค้า → {{User message}}
รหัสลูกค้าจาก Facebook หรือ LINE → {{Platform user id}}
รหัสลูกค้า/ห้องแชทบน Oho Chat → {{Oho user id}}
ชื่อลูกค้า → {{ชื่อลูกค้า}}
ชื่อธุรกิจ → {{ชื่อธุรกิจ}}
ชื่อบัญชีโซเซียลมีเดีย → {{ชื่อบัญชีโซเชียลมีเดีย}}

เลือก Method ที่ต้องการใช้ดึงข้อมูล *จำเป็น
กำหนด parameter ที่ต้องการแนบไปด้วย (ถ้ามี)
กรอก Requests Body (ถ้ามี)

ตัวอย่างการตั้งค่า

รูปแบบของไฟล์ JSON

Oho chat จะทำการแปลง JSON body ที่ได้รับจาก API เป็นข้อความ, รูปภาพ, การ์ด carousel และ ปุ่ม quick replies โดยจะต้องมีรูปแบบดังนี้

**URI ต้องเป็นภาษาอังกฤษทั้งหมด (encode URI)

Messages payload

ในส่วนของ Messages payload จะประกอบไปด้วยการตอบกลับในรูปแบบ ข้อความ, รูปภาพ, ไฟล์ โดยรวมกันแล้วจะต้องไม่เกิน 5 บับเบิ้ล

รูปแบบ JSON body ของการตอบกลับรูปแบบข้อความ

{
      "type": "text",
      "text": "สวัสดีค่ะคุณลูกค้า โอ้โหเป็นตัวช่วยจัดการแชทลูกค้าให้ครบจบในที่เดียวสามารถดูรายละเอียดเพิ่มเติมและสมัครใช้งานได้ที่ https://www.oho.chat/ หากคุณลูกค้าสนใจ สามารถดูรายละเอียด ราคา และการใช้งานต่าง ๆ ได้ด้านล่างนี้เลยค่ะ"
}

ตัวอย่าง รูปแบบ JSON body ของการตอบกลับรูปแบบข้อความ

Key	Description	Type of value
type	กรณีเป็นข้อความให้กำหนด value เป็น `“text”`	String
text	ข้อความใน 1 บับเบิ้ล (ไม่เกิน 2,000 ตัวอักษร)	String

ตัวอย่าง การตอบกลับรูปแบบข้อความ

รูปแบบ JSON body ของการตอบกลับรูปแบบรูปภาพ, ไฟล์

{
       "type": "image",
       "media_title": "know_oho_more",
       "media_size": 100,
       "media_content_type": "image",
       "mediaUrl": "https://storage.googleapis.com/production.storage.oho.chat/files/6363a4379ad041ae8af1e543/6597a35bf24493fbeda38cf8.png",
}

Key	Description	Type of value
type	สามารถระบุประเภทได้ 2 ประเภทดังนี้ - รูปภาพ ให้กำหนด value เป็น `“image”` - ไฟล์ ให้กำหนด value เป็น `“file”`	String
media_title	ชื่อของรูปภาพ	String
media_size	ขนาดของรูปภาพ (หน่วยเป็นเปอร์เซนต์ของรูปภาพ) * แนะนำภาพอัตราส่วน 3:2 (600x400px)	Number
media_content_type	สามารถระบุประเภทได้ 2 ประเภทดังนี้ - รูปภาพ ให้กำหนด value เป็น `“image”` - ไฟล์ ให้กำหนด value เป็น `“file”`	String
mediaUrl	Path ของรูปภาพหรือไฟล์	String

ตัวอย่าง การตอบกลับรูปแบบรูปภาพ

รูปแบบ JSON body ของการตอบกลับรูปแบบการ์ด carousel

{
   "type":"carousel",
   "items":[
      {
         "order_index":0,
         "title":"โอ้โหแชทคืออะไร",
         "description":"ระบบจัดการแชทบริการลูกค้า",
         "mediaType":"image",
         "mediaUrl":"https://storage.googleapis.com/production.storage.oho.chat/files/6363a4379ad041ae8af1e543/65979c4f314f01dfe2f43f48.png",
         "actions":[
            {
               "order_index":0,
               "text":"เริ่มต้นใช้งาน",
               "type":"postback",
               "payload":"arp_id=6530caefa6990f7695c8c803&label=%E0%B9%80%E0%B8%A3%E0%B8%B4%E0%B9%88%E0%B8%A1%E0%B8%95%E0%B9%89%E0%B8%99%E0%B9%83%E0%B8%8A%E0%B9%89%E0%B8%87%E0%B8%B2%E0%B8%99"
            },
            {
               "order_index":1,
               "text":"คู่มือการใช้งาน",
               "type":"link",
               "uri":"https://help.oho.chat/"
            }
         ]
      },
      {
         "order_index":1,
         "title":"ราคาและแพ็กเกจ",
         "description":"ราคาระบบ Oho Chat",
         "mediaType":"image",
         "mediaUrl":"https://storage.googleapis.com/production.storage.oho.chat/files/6363a4379ad041ae8af1e543/65979c53d2f86ce64265d023.png",
         "actions":[
            {
               "order_index":0,
               "text":"แพ็กเกจ",
               "type":"postback",
               "payload":"arp_id=6530dfscs8546f7695c8a545&label=%E0%B9%81%E0%B8%9E%E0%B9%87%E0%B8%81%E0%B9%80%E0%B8%81%E0%B8%88"
            },
            {
               "order_index":1,
               "text":"รายละเอียดราคา",
               "type":"webview",
               "uri":"https://www.oho.chat/pricing"
            }
         ]
      }
   ]
}

Key	Description	Type of value
type	กรณีเป็นการ์ดให้กำหนด value เป็น `“carousel”`	String
items	ข้อมูลของการ์ดแต่ละใบ	array of objects
order_index	ลำดับของการ์ด	Number
title	ชื่อของการ์ด (ไม่เกิน 40 ตัวอักษร)	String
description	คำอธิบายการ์ด (ไม่เกิน 40 ตัวอักษร)	String
mediaType	ประเภทให้กำหนด Value เป็น `“image”`	String
mediaUrl	Path ของรูปภาพในการ์ดที่จะให้แสดงในการ์ด	String
actions	คำสั่งของแต่ละปุ่มในการ์ด (มีปุ่มได้มากสุด 3 ปุ่ม)	array of objects
order_index	ลำดับของปุ่มในการ์ด	Number
text	ชื่อของปุ่มในการ์ด	String
type	คำสั่งของแต่ละปุ่ม โดยสามารถกำหนดได้ 3 คำสั่งดังนี้ - เปิดลิงก์ URL ให้กำหนด value เป็น `“link”` - Web view app ให้กำหนด value เป็น `“webview”` - ไปที่ข้อความตอบกลับอื่น ให้กำหนด value เป็น `“postback”`	String
payload	id และชื่อของข้อความตอบกลับแชทที่ต้องลิงก์ไป โดยมีรูปแบบดังนี้ `"art_id={id ของข้อความตอบกลับแชท}&label={encode ชื่อข้อความตอบกลับแชท}"`	String
uri	Path ของเว็บไซต์ที่ต้องการเปิด	String

ตัวอย่าง การตอบกลับรูปแบบการ์ด carousel

ข้อควรระวัง

กรณีที่มีรูปภาพในการ์ด ทุกการ์ดจะต้องมีรูปภาพ
กรณีที่มีปุ่มในการ์ด ทุกการ์ดจะต้องมีปุ่มเท่ากัน
กรณีที่มีคำอธิบายการ์ด ทุกการ์ดจะต้องมีคำอธิบาย

Quick replies payload

Quick replies payload คือ ปุ่มข้อความที่ผู้ใช้งานสามารถกำหนดคำสั่งการทำงานให้ลิงก์ไปยังข้อความตอบกลับอื่นหรือเปิดเว็บไซต์ภายนอกได้ โดยมีได้มากสุด 13 ปุ่ม

รูปแบบ JSON body ของการตอบกลับรูปปุ่มข้อความ

"quickRepliesPayload": [
    {
      "order_index": 0,
      "text": "โอ้โหแชท คืออะไร",
      "type": "postback",
      "payload": "arp_id=8754dfscs8546f7695c8s547&label=%E0%B9%81%E0%B8%9E%E0%B9%87%E0%B8%81%E0%B9%80%E0%B8%81%E0%B8%88"
    },
    {
      "order_index": 1,
      "text": "แจ้งปัญหาการใช้งาน",
      "type": "postback",
      "payload": "arp_id=8754dfscs8546f7695c8s547&label=%E0%B9%81%E0%B8%88%E0%B9%89%E0%B8%87%E0%B8%9B%E0%B8%B1%E0%B8%8D%E0%B8%AB%E0%B8%B2%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B9%83%E0%B8%8A%E0%B9%89%E0%B8%87%E0%B8%B2%E0%B8%99"
    }
  ]

Key	Description	Type of value
order_index	ลำดับของปุ่ม	Number
text	ชื่อของปุ่มในการ์ด (ไม่เกิน 20 ตัวอักษร)	String
type	คำสั่งของแต่ละปุ่ม ซึ่งมีเพียง 1 คำสั่งนั้นคือ ไปที่ข้อความตอบกลับอื่น โดยให้ กำหนด value เป็น `“postback”`	String
payload	id และชื่อของข้อความตอบกลับแชทที่ต้องลิงก์ไป โดยมีรูปแบบดังนี้ `"art_id={id ของข้อความตอบกลับแชท}&label={encode ชื่อข้อความตอบกลับแชท}"`	String

ตัวอย่าง การตอบกลับรูปแบบปุ่ข้อความ

วิธีการคัดลอก ID ของข้อความตอบกลับแชท

เข้าสู่หน้าข้อความตอบกลับแชทที่ต้องการ โดยการคลิกปุ่ม แชทบอท ทางซ้ายมือ → เลือกแท็บ ตอบกลับแชท → เลือกข้อความตอบกลับแชทที่ต้องการ
คัดลอกรหัสข้อความตอบกลับแชทจาก URL

https://app.oho.chat/business/ID ธุรกิจ/auto-raeply/ID ของข้อความตอบกลับแชท

ตัวอย่างรูปแบบไฟล์ JSON

{
  "messagesPayload": [
    {
       "type": "image",
       "media_title": "know_oho_more",
       "media_size": 100,
       "media_content_type": "image",
       "mediaUrl": "https://storage.googleapis.com/production.storage.oho.chat/files/6363a4379ad041ae8af1e543/6597a35bf24493fbeda38cf8.png"
		},
		{
      "type": "text",
      "text": "สวัสดีค่ะคุณลูกค้า โอ้โหเป็นตัวช่วยจัดการแชทลูกค้าให้ครบจบในที่เดียวสามารถดูรายละเอียดเพิ่มเติมและสมัครใช้งานได้ที่ https://www.oho.chat/ หากคุณลูกค้าสนใจ สามารถดูรายละเอียด ราคา และการใช้งานต่าง ๆ ได้ด้านล่างนี้เลยค่ะ"
		},
		{
   "type":"carousel",
   "items":[
      {
         "order_index":0,
         "title":"โอ้โหแชทคืออะไร",
         "description":"ระบบจัดการแชทบริการลูกค้า",
         "mediaType":"image",
         "mediaUrl":"https://storage.googleapis.com/production.storage.oho.chat/files/6363a4379ad041ae8af1e543/65979c4f314f01dfe2f43f48.png",
         "actions":[
            {
               "order_index":0,
               "text":"เริ่มต้นใช้งาน",
               "type":"postback",
               "payload":"arp_id=6530caefa6990f7695c8c803&label=%E0%B9%80%E0%B8%A3%E0%B8%B4%E0%B9%88%E0%B8%A1%E0%B8%95%E0%B9%89%E0%B8%99%E0%B9%83%E0%B8%8A%E0%B9%89%E0%B8%87%E0%B8%B2%E0%B8%99"
            },
            {
               "order_index":1,
               "text":"คู่มือการใช้งาน",
               "type":"link",
               "uri":"https://help.oho.chat/"
            }
         ]
      },
      {
         "order_index":1,
         "title":"ราคาและแพ็กเกจ",
         "description":"ราคาระบบ Oho Chat",
         "mediaType":"image",
         "mediaUrl":"https://storage.googleapis.com/production.storage.oho.chat/files/6363a4379ad041ae8af1e543/65979c53d2f86ce64265d023.png",
         "actions":[
            {
               "order_index":0,
               "text":"แพ็กเกจ",
               "type":"postback",
               "payload":"arp_id=6530dfscs8546f7695c8a545&label=%E0%B9%81%E0%B8%9E%E0%B9%87%E0%B8%81%E0%B9%80%E0%B8%81%E0%B8%88"
            },
            {
               "order_index":1,
               "text":"รายละเอียดราคา",
               "type":"webview",
               "uri":"https://www.oho.chat/pricing"
						}
					]
				}
			]
		}
  ],
  "quickRepliesPayload": [
    {
      "order_index": 0,
      "text": "โอ้โหแชท คืออะไร",
      "type": "postback",
      "payload": "arp_id=8754dfscs8546f7695c8s547&label=%E0%B9%81%E0%B8%9E%E0%B9%87%E0%B8%81%E0%B9%80%E0%B8%81%E0%B8%88"
    },
    {
      "order_index": 1,
      "text": "แจ้งปัญหาการใช้งาน",
      "type": "postback",
      "payload": "arp_id=8754dfscs8546f7695c8s547&label=%E0%B9%81%E0%B8%88%E0%B9%89%E0%B8%87%E0%B8%9B%E0%B8%B1%E0%B8%8D%E0%B8%AB%E0%B8%B2%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B9%83%E0%B8%8A%E0%B9%89%E0%B8%87%E0%B8%B2%E0%B8%99"
    }
  ]
}

ตัวอย่างรูปแบบไฟล์ JSON

ตัวอย่างการตอบกลับจาก API