เนื้อหานี้เป็นตอนที่สอง ต่อจากตอนที่แล้วที่เราได้สร้าง app สำหรับกำหนดค่าต่างๆ ในการใช้งาน
LINE Messaging API ไปแล้ว
การใช้งาน LINE Messaging API สร้าง Bot ให้บริการและโต้ตอบกับผู้ใช้ ตอนที่ 1 http://niik.in/834
https://www.ninenik.com/content.php?arti_id=834 via @ninenik
เนื้อหาต่อไปนี้ เราจะใช้ LINE bot sdk ของ php ในการจัดการเกี่ยวกับการส่งข้อความตอบกลับ
กับผู้ใช้ ซึ่งมีคำสั่งต่างๆ ให้เราใช้งานได้ง่ายและสะดวก โดยจะทำการติดตั้ง package ผ่าน composer
ให้เราเปิดโปรแกรมจัดการคำสั่ง command line แล้วพิมพ์คำสั่ง
composer require linecorp/line-bot-sdk
หรือดูแนวทางการติดตั้งและใช้งานได้ด้วยตัวเองที่
ในที่นี้จะติดตั้งที่เครื่องก่อน แล้วค่อยอัพโหลดโฟลเดอร์ vendor ขึ้น server ไว้ใช้งาน
หลังจากติดตั้ง package แล้ว เราก็จะได้โฟลเดอร์ vendor ซึ่งด้านในจะมี line-bot-sdk-php เป็น
package สำหรับใช้งานการจัดการกับ LINE Messaging API สามารถอัพโหลดโฟลเดอร์ vendor
ขึ้นโฟลเดอร์ และไปในขั้นตอนต่อไป
จากนั้นให้เราสร้างไฟล์ชื่อ bot_settings.php กำหนดค่าต่างๆ ที่จะเป็นดังนี้
ไฟล์ bot_settings.php
<?php
/// การตั้งค่าเกี่ยวกับ bot ใน LINE Messaging API
define('LINE_MESSAGE_CHANNEL_ID','กรอก ค่า Channel ID');
define('LINE_MESSAGE_CHANNEL_SECRET','กรอกค่า Channel secret');
define('LINE_MESSAGE_ACCESS_TOKEN','กรอกค่า Channel access token');
?>
ต่อด้วยในส่วนของไฟล์ bot.php ที่เราสร้างจากเนื้อหาในตอนที่แล้ว
โดยเพิ่มโค้ดการตอบกลับ ข้อมูลที่ถูกส่งกลับมาอย่างง่าย
ไฟล์ bot.php
<?php
// กรณีต้องการตรวจสอบการแจ้ง error ให้เปิด 3 บรรทัดล่างนี้ให้ทำงาน กรณีไม่ ให้ comment ปิดไป
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
// include composer autoload
require_once '../vendor/autoload.php';
// การตั้งเกี่ยวกับ bot
require_once 'bot_settings.php';
// กรณีมีการเชื่อมต่อกับฐานข้อมูล
//require_once("dbconnect.php");
///////////// ส่วนของการเรียกใช้งาน class ผ่าน namespace
use LINE\LINEBot;
use LINE\LINEBot\HTTPClient;
use LINE\LINEBot\HTTPClient\CurlHTTPClient;
//use LINE\LINEBot\Event;
//use LINE\LINEBot\Event\BaseEvent;
//use LINE\LINEBot\Event\MessageEvent;
use LINE\LINEBot\MessageBuilder;
use LINE\LINEBot\MessageBuilder\TextMessageBuilder;
use LINE\LINEBot\MessageBuilder\StickerMessageBuilder;
use LINE\LINEBot\MessageBuilder\ImageMessageBuilder;
use LINE\LINEBot\MessageBuilder\LocationMessageBuilder;
use LINE\LINEBot\MessageBuilder\AudioMessageBuilder;
use LINE\LINEBot\MessageBuilder\VideoMessageBuilder;
use LINE\LINEBot\ImagemapActionBuilder;
use LINE\LINEBot\ImagemapActionBuilder\AreaBuilder;
use LINE\LINEBot\ImagemapActionBuilder\ImagemapMessageActionBuilder ;
use LINE\LINEBot\ImagemapActionBuilder\ImagemapUriActionBuilder;
use LINE\LINEBot\MessageBuilder\Imagemap\BaseSizeBuilder;
use LINE\LINEBot\MessageBuilder\ImagemapMessageBuilder;
use LINE\LINEBot\MessageBuilder\MultiMessageBuilder;
use LINE\LINEBot\TemplateActionBuilder;
use LINE\LINEBot\TemplateActionBuilder\DatetimePickerTemplateActionBuilder;
use LINE\LINEBot\TemplateActionBuilder\MessageTemplateActionBuilder;
use LINE\LINEBot\TemplateActionBuilder\PostbackTemplateActionBuilder;
use LINE\LINEBot\TemplateActionBuilder\UriTemplateActionBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder;
use LINE\LINEBot\MessageBuilder\TemplateMessageBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder\ButtonTemplateBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder\CarouselTemplateBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder\CarouselColumnTemplateBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder\ConfirmTemplateBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder\ImageCarouselTemplateBuilder;
use LINE\LINEBot\MessageBuilder\TemplateBuilder\ImageCarouselColumnTemplateBuilder;
// เชื่อมต่อกับ LINE Messaging API
$httpClient = new CurlHTTPClient(LINE_MESSAGE_ACCESS_TOKEN);
$bot = new LINEBot($httpClient, array('channelSecret' => LINE_MESSAGE_CHANNEL_SECRET));
// คำสั่งรอรับการส่งค่ามาของ LINE Messaging API
$content = file_get_contents('php://input');
// แปลงข้อความรูปแบบ JSON ให้อยู่ในโครงสร้างตัวแปร array
$events = json_decode($content, true);
if(!is_null($events)){
// ถ้ามีค่า สร้างตัวแปรเก็บ replyToken ไว้ใช้งาน
$replyToken = $events['events'][0]['replyToken'];
}
// ส่วนของคำสั่งจัดเตียมรูปแบบข้อความสำหรับส่ง
$textMessageBuilder = new TextMessageBuilder(json_encode($events));
//l ส่วนของคำสั่งตอบกลับข้อความ
$response = $bot->replyMessage($replyToken,$textMessageBuilder);
if ($response->isSucceeded()) {
echo 'Succeeded!';
return;
}
// Failed
echo $response->getHTTPStatus() . ' ' . $response->getRawBody();
?>
กรอกข้อมูลที่จำเป็นในไฟล์ให้ครบถ้วน เสร็จแล้วเรามาลองทดสอบ ส่งข้อความไปยัง bot ที่เรา
สร้างดู จะได้ผลล้พธ์ดังรูปด้านล่าง
นี่คือรูปแบบโครงสร้างของ JSON string
{
"events": [
{
"type": "message",
"replyToken": "ค่า replyToken ของเราที่สนทนากับ bot",
"source": {
"userId": "ไอดีของ user line ของเรา",
"type": "user"
},
"timestamp": 1510665495557,
"message": {
"type": "text",
"id": "ไอดีของข้อความ",
"text": "ข้อความที่เราส่งไป"
}
}
]
}
Bot จะส่งข้อความกลับมาหาเราโดยอาศัยค่าจาก replyToken ที่ได้ นำมาใช้งานในคำสั่ง
$response = $bot->replyMessage($replyToken,$textMessageBuilder);
โครงสร้างของ JSON string เป็น Webhook event objects ที่ bot ส่งกลับมาให้เรา เราสามารถใช้ค่า
นี้ในการจัดการเงื่อนไขของการส่งข้อความให้กับ bot ได้ สมมติเช่น ให้ bot เช็คจาก "ข้อความที่เราส่งไป"
ถ้าเป็นค่า A ให้ตอบกลับ คุณพิมพ์ A สามารถปรับในส่วนของโค้ดทดสอบเป็นดังนี้
ตัวอย่างโค้ดบางส่วน
// แปลงข้อความรูปแบบ JSON ให้อยู่ในโครงสร้างตัวแปร array
$events = json_decode($content, true);
if(!is_null($events)){
// ถ้ามีค่า สร้างตัวแปรเก็บ replyToken ไว้ใช้งาน
$replyToken = $events['events'][0]['replyToken'];
$typeMessage = $events['events'][0]['message']['type'];
$userMessage = $events['events'][0]['message']['text'];
switch ($typeMessage){
case 'text':
switch ($userMessage) {
case "A":
$textReplyMessage = "คุณพิมพ์ A";
break;
case "B":
$textReplyMessage = "คุณพิมพ์ B";
break;
default:
$textReplyMessage = " คุณไม่ได้พิมพ์ A และ B";
break;
}
break;
default:
$textReplyMessage = json_encode($events);
break;
}
}
// ส่วนของคำสั่งจัดเตียมรูปแบบข้อความสำหรับส่ง
$textMessageBuilder = new TextMessageBuilder($textReplyMessage);
//l ส่วนของคำสั่งตอบกลับข้อความ
$response = $bot->replyMessage($replyToken,$textMessageBuilder);
ผลลัพธ์ที่ได้
โค้ดข้างต้น เป็นตัวอย่างการตรวจสอบข้อความ และตอบกลับด้วยเงื่อนไขอย่างง่าย
สังเกตในส่วนของ $typeMessage ในตัวอย่างข้างต้น เราตรวจสอบเฉพาะข้อความที่เราส่งไปหา bot
กรณีที่เป็น text เท่านั้น โดยประเภทข้อความต่างๆ ได้แก่
1. Text ข้อความ
2. Image รูปภาพ
3. Video ไฟล์วิดีโอ
4. Audio ไฟล์เสียง
5. Location ตำแหน่งพิกัด gps
6. Sticker สติ๊กเกอร์
7. Imagemap รูปภาพที่มีการกำหนดส่วนควบคุมเป็นจุดๆ ในตำแหน่งภาพ
8. Template รูปแบบเลเอาท์เพิ่มเติมที่ LINE กำหนด เช่น ปุ่ม รูปเลื่อน ปุ่มยืนยัน เป็นต้น
โดยในฝั่งผู้ใช้ สามารถส่งข้อมูลได้ตั้งแต่ประเภทที่ 1 - 6 แต่ในฝั่งของ bot เราสามารถกำหนดให้ bot
ส่งข้อมูลได้ครบทั้ง 8 รูปแบบ
มาดูตัวอย่างโค้ดที่เรากำหนด ให้ bot ตอบกลับข้อความในแบบต่างๆ โดยให้ผู้ใช้กรอกเฉพาะตัวอักษรหน้า
ของ type แต่ละประเภท เช่น สมมติพิมพ์ t ก็ให้ bot ตอบกลับเป็น text และถ้าพิมพ์ i ให้ bot ตอบกลับมาเป้น
รูปภาพ (สำหรับการใช้งานรูปภาพ สามารถดูเพิ่มเติมเนื้อหาตามลิ้งค์ด้านล่างนี้เป็นแนวทาง)
การประยุกต์ mod_rewrite ใช้งานร่วมกับ Intervention Image http://niik.in/833
https://www.ninenik.com/content.php?arti_id=833 via @ninenik
โค้ดไฟล์ bot.php บางส่วน
// แปลงข้อความรูปแบบ JSON ให้อยู่ในโครงสร้างตัวแปร array
$events = json_decode($content, true);
if(!is_null($events)){
// ถ้ามีค่า สร้างตัวแปรเก็บ replyToken ไว้ใช้งาน
$replyToken = $events['events'][0]['replyToken'];
$typeMessage = $events['events'][0]['message']['type'];
$userMessage = $events['events'][0]['message']['text'];
$userMessage = strtolower($userMessage);
switch ($typeMessage){
case 'text':
switch ($userMessage) {
case "t":
$textReplyMessage = "Bot ตอบกลับคุณเป็นข้อความ";
$replyData = new TextMessageBuilder($textReplyMessage);
break;
case "i":
$picFullSize = 'https://www.mywebsite.com/imgsrc/photos/f/simpleflower';
$picThumbnail = 'https://www.mywebsite.com/imgsrc/photos/f/simpleflower/240';
$replyData = new ImageMessageBuilder($picFullSize,$picThumbnail);
break;
case "v":
$picThumbnail = 'https://www.mywebsite.com/imgsrc/photos/f/sampleimage/240';
$videoUrl = "https://www.mywebsite.com/simplevideo.mp4";
$replyData = new VideoMessageBuilder($videoUrl,$picThumbnail);
break;
case "a":
$audioUrl = "https://www.mywebsite.com/simpleaudio.mp3";
$replyData = new AudioMessageBuilder($audioUrl,27000);
break;
case "l":
$placeName = "ที่ตั้งร้าน";
$placeAddress = "แขวง พลับพลา เขต วังทองหลาง กรุงเทพมหานคร ประเทศไทย";
$latitude = 13.780401863217657;
$longitude = 100.61141967773438;
$replyData = new LocationMessageBuilder($placeName, $placeAddress, $latitude ,$longitude);
break;
case "s":
$stickerID = 22;
$packageID = 2;
$replyData = new StickerMessageBuilder($packageID,$stickerID);
break;
case "im":
$imageMapUrl = 'https://www.mywebsite.com/imgsrc/photos/w/sampleimagemap';
$replyData = new ImagemapMessageBuilder(
$imageMapUrl,
'This is Title',
new BaseSizeBuilder(699,1040),
array(
new ImagemapMessageActionBuilder(
'test image map',
new AreaBuilder(0,0,520,699)
),
new ImagemapUriActionBuilder(
'https://www.ninenik.com',
new AreaBuilder(520,0,520,699)
)
));
break;
case "tm":
$replyData = new TemplateMessageBuilder('Confirm Template',
new ConfirmTemplateBuilder(
'Confirm template builder',
array(
new MessageTemplateActionBuilder(
'Yes',
'Text Yes'
),
new MessageTemplateActionBuilder(
'No',
'Text NO'
)
)
)
);
break;
default:
$textReplyMessage = " คุณไม่ได้พิมพ์ ค่า ตามที่กำหนด";
$replyData = new TextMessageBuilder($textReplyMessage);
break;
}
break;
default:
$textReplyMessage = json_encode($events);
$replyData = new TextMessageBuilder($textReplyMessage);
break;
}
}
//l ส่วนของคำสั่งตอบกลับข้อความ
$response = $bot->replyMessage($replyToken,$replyData);
ดูรูปผลลัพธ์ในแต่ละกรณี จะได้เป็นดังนี้
ค่าต่างๆ ที่ใช้ในการกำหนด จะมีเงื่อนไขรุปแบบแตกต่างกัน สามารถดูการกำหนดค่า parameter ได้ที่
ตัวอย่างเช่น การกำหนดให้ bot ส่งสติ๊กเกอร์ สามารถกำหนดค่า Package ID และ Sticker ID ที่สามารถใช้งานได้
$stickerID = 22; $packageID = 2; $replyData = new StickerMessageBuilder($packageID,$stickerID);
การกำหนด สำหรับ Audio เราสามารถให้ bot ส่ง ไฟล์ลิ้งค์ไฟล์เสียงที่เป็น mp3 หรือ wav หรือ m4a โดยต้องเป็นไฟล์ที่มี
ขนาดไฟล์ไม่เกิน 10 MB ความยาวไม่เกิน 1 นาที ในขั้นตอนการส่งค่า ต้องกำหนดเวลาของไฟล์นั้นในหน่วย มิลลิวินาทีไปด้วย
เช่น 2 วิ ก็จะเป็น 2000 มิลลิวินาที
$audioUrl = "https://www.mywebsite.com/simpleaudio.mp3"; $replyData = new AudioMessageBuilder($audioUrl,27000);
และเท่าที่สังเกต พบว่าในบางครั้งการส่งข้อความแบบ audio นั้นถ้าเป็นผ่าน LINE app บนมือถือ จะไม่สามารถเล่นไฟล์ได้หรือขึ้น error
แต่ถ้าเปิดผ่าน LINE App บนคอม PC สามารถเปิดฟังได้ปกติ อย่างไรก็ตาม ส่วนนี้เป็นข้อสังเกต เท่านั้น อาจจะไม่เกิดกับทุกคน
หรือเกิดบางกรณีก็เป็นได้
การกำหนดสำหรับ video เราสามารถให้ bot ส่งลิ้งค์ไฟล์ video โดยมีเงื่อนไขว่า เป็นไฟล์ mp4 ขนาดไฟล์ไม่เกิน 10 MB
ความยาว video ต้องน้อยกว่า 1 นาที
$picThumbnail = 'https://www.mywebsite.com/imgsrc/photos/f/sampleimage/240'; $videoUrl = "https://www.mywebsite.com/simplevideo.mp4"; $replyData = new VideoMessageBuilder($videoUrl,$picThumbnail);
สังเกตส่วนของการกำหนดรูป preview ของไฟล์ video หรือกรณีส่งเป็น image ขนาดความกว้างความสูงของไฟล์
preview ต้องมีขนาด 240x240 และขนาดไฟล์ไม่เกิน 1 MB
$picFullSize = 'https://www.mywebsite.com/imgsrc/photos/f/simpleflower'; $picThumbnail = 'https://www.mywebsite.com/imgsrc/photos/f/simpleflower/240'; $replyData = new ImageMessageBuilder($picFullSize,$picThumbnail);
ดูแนวทางการใช้ประยุกต์การใช้งานรูปภาพได้ที่บทความ
การประยุกต์ mod_rewrite ใช้งานร่วมกับ Intervention Image http://niik.in/833
https://www.ninenik.com/content.php?arti_id=833 via @ninenik
สำหรับในส่วนของการส่ง ImageMap กับ Template นั้น จะขอกล่าวเพิ่มเติมในภายหลัง เนื่องจากรูปแบบทั้งสองนี้
เป็นการโต้ตอบกับผู้ใช้ผ่านข้อความที่ bot ส่งมา และเราสามารถสั่งให้ bot ทำงานเมื่อผู้ใช้มีการปฏิสัมพันธ์โต้ตอบกับ
ข้อความของทั้งสองรูปแบบนี้ได้ รอติดตาม
อ่านต่อที่บทความ
เนื้อหาที่เกี่ยวข้อง