Receive Location

การส่ง location หาบอทนั้นทำได้เฉพาะบนมือถือเท่านั้น

เป้าประสงค์ของบทนี้คือต้องการให้ท่านเห็นลักษณะของ message ที่ Facebook ส่งมาให้บอท เพื่อที่ท่านจะได้มีไอเดียว่าจะทำอะไรกับมันได้บ้าง ลักษณะ message เมื่อมีคนส่ง Location มาให้บอทจะเป็นดังนี้

{
    "object": "page",
    "entry": [
        {
            "id": "127997317916506",
            "time": 1510126336984,
            "messaging": [
                {
                    "sender": {
                        "id": "1519659551459981"
                    },
                    "recipient": {
                        "id": "127997317916506"
                    },
                    "timestamp": 1510126336897,
                    "message": {
                        "mid": "mid.$cAAB0afwBne9ly9CDgVfmos1Xynvu",
                        "seq": 156772,
                        "attachments": [
                            {
                                "title": "\u0e2b\u0e19\u0e49\u0e32\u0e42\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e19 \u0e40\u0e15\u0e23\u0e35\u0e22\u0e21\u0e2d\u0e38\u0e14\u0e21\u0e28\u0e36\u0e01\u0e29\u0e32\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e01\u0e32\u0e23 \u0e23\u0e31\u0e0a\u0e14\u0e32",
                                "url": "https:\/\/l.facebook.com\/l.php?u=https\u00253A\u00252F\u00252Fwww.bing.com\u00252Fmaps\u00252Fdefault.aspx\u00253Fv\u00253D2\u002526pc\u00253DFACEBK\u002526mid\u00253D8100\u002526where1\u00253DBangkok\u0025252C\u00252BThailand\u00252B10400\u002526FORM\u00253DFBKPL1\u002526mkt\u00253Den-US&h=ATNhmAN3G298HD2isU6oA_W42o-SzccHcLp2jSnsSYdovV0OKoSmjCKSYkMe30-KBJvsPdQT84yHW_if-lz3-_3H_1IgbAZ-dPSYY18JhnyzwbiyDg&s=1&enc=AZOb1nynYdq3B1sn0kUMZIB7ZNvR-VE87bLrvDg8OpkIV2MZ-3XQaPjzIDupJE0NnSz52axehFXjhf0Y8M1_5x1B",
                                "type": "location",
                                "payload": {
                                    "coordinates": {
                                        "lat": 13.772969111475,
                                        "long": 100.57386455084
                                    }
                                }
                            }
                        ]
                    }
                }
            ]
        }
    ]
}

ข้อสังเกตุ

1. entry เป็นอะเรย์
2. messaging เป็นอะเรย์
3. message จะมีโหนด attachments ซึ่งเป็นอะเรย์
4. attachments เป็นอะเรย์
5. มี url สำหรับเปิดดูแผนที่
6. มี lat, long มาให้

ทดลองเขียนโค้ด

<?php

$access_token = 'EAAFUz3HsNTEBAFZAeDiZA8ywOtEUZB52ZBLYziFtXjZCZAUZBmqlUtuemBnbbkN3M25NBKutMZCDzngjD0Uxz530fFmIiJHnFDHZBen9KRGvWZBjnti5awKG6a1g4XfaO8ZCKVfG2Cer5nu3W0uvubzk4wYfpsZCc9QfLGe2tiVZA5JGY6QZDZD';

/* validate verify token needed for setting up web hook */ 

if (isset($_GET['hub_verify_token'])) { 
    if ($_GET['hub_verify_token'] === $access_token) {
        echo $_GET['hub_challenge'];
        return;
    } else {
        echo 'Invalid Verify Token';
        return;
    }
}


/* receive and send messages */
$input = json_decode(file_get_contents('php://input'), true);


if (isset($input['entry'][0]['messaging'][0]['sender']['id'])) {

    $sender = $input['entry'][0]['messaging'][0]['sender']['id']; //sender facebook id
    $lat = $input['entry'][0]['messaging'][0]['message']['attachments'][0]['payload']['coordinates']['lat'];

    $url = 'https://graph.facebook.com/v2.6/me/messages?access_token='. $access_token;

    /*initialize curl*/
    $ch = curl_init($url);

    /*prepare response*/
    $jsonData = '{
    "recipient":{
        "id":"' . $sender . '"
        },
        "message":{
            "text": "Your latitude location is '. $lat .'"
        }
    }';

    /* curl setting to send a json post data */
    curl_setopt($ch, CURLOPT_POST, 1);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $jsonData);
    curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-Type: application/json'));

    $result = curl_exec($ch); // user will get the message
}

อธิบายโค้ด

โค้ดนี้ไว้ใช้สำหรับให้ทาง Facebook ตรวจสอบเรื่อง callback URL ที่ผมเขียนไว้ในบท Facebook เรายังเก็บไว้ในหัวไฟล์โค้ดเราเสมอ

/* validate verify token needed for setting up web hook */ 

if (isset($_GET['hub_verify_token'])) { 
    if ($_GET['hub_verify_token'] === $access_token) {
        echo $_GET['hub_challenge'];
        return;
    } else {
        echo 'Invalid Verify Token';
        return;
    }
}

แปลง JSON ที่ Facebook ส่งมาให้ไปเป็นอะเรย์ เพื่อง่ายต่อการเขียนโค้ด

/* receive and send messages */
$input = json_decode(file_get_contents('php://input'), true);

ตรวจสอบว่า message ที่ส่งมานั้นมี id ของผู้ส่งหรือเปล่า อันนี้เป็นการตรวจสอบคร่าวๆว่ามีคนคุยกับบอท ไม่ใช่เรียก URL เว็บขึ้นมาตรงๆ ผมเขียนตรวจสอบไว้เพียงเล็กน้อยเท่านั้น เพื่อไม่ให้โค้ดมันดูยุ่งยากเกินไป เมื่อถึงตอนท่านเขียนโค้ดเพื่อใช้งานจริงๆ ก็อาจจะตรวจสอบให้รัดกุมขึ้นอีกหน่อย

if (isset($input['entry'][0]['messaging'][0]['sender']['id']))

เก็บ Latitude ของ Location ที่แชร์มา ไว้ในตัวแปร เดี๋ยวจะเอามันไปประกอบเป็นข้อความส่งกลับไปหายูสเซอร์

$lat = $input['entry'][0]['messaging'][0]['message']['attachments'][0]['payload']['coordinates']['lat'];

URL นี้เป็น enpoint api ของ Facebook ที่เราสามารถ POST ข้อความไปให้ Facebook เพื่อให้ Facebook ส่งข้อความต่อไปให้บุคคลที่ระบุ

$url = 'https://graph.facebook.com/v2.6/me/messages?access_token='. $access_token;

เราจะใช้ cURL ยิง POST ไปหา Facebook

/*initialize curl*/
$ch = curl_init($url);

message ที่เราจะยิงไปให้ Facebook จะต้องอยู่ในรูปแบบของ JSON ระบุ id ของผู้รับและข้อความที่เราต้องการส่งไปให้

/*prepare response*/
$jsonData = '{
"recipient":{
    "id":"' . $sender . '"
    },
    "message":{
        "text": "Your file URL is '. $file_url .'"
    }
}';

สั่ง cURL ยิง JSON ไปยัง endpoint api ของ Facebook ก็เป็นอันเรียบร้อยว่าบอทได้ตอบกลับไปหายูสเซอร์ที่ทักมา

/*prepare response*/
$jsonData = '{
"recipient":{
    "id":"' . $sender . '"
    },
    "message":{
        "text": "Your latitude location is '. $lat .'"
    }
}';

หลังจาก commit changes โค้ดแล้วให้ใช้มือถือแชร์ Location ไปให้บอท ซึ่งบอทจะต้องตอบกลับมาว่า Your latitude location is ตามด้วย Latitude ของ Location ที่แชร์ไป