Facebook Messenger API: Trouble setting up a webhook

17
votes

I am trying to set up a web hook for the new Facebook Messenger bot platform on my PHP webserver and am receiving this error:

The URL couldn't be validated. Response does not match challenge, expected value = '364011207', received='

Resources

https://developers.facebook.com/docs/messenger-platform/quickstart

https://developers.facebook.com/docs/messenger-platform/webhook-reference#common_format

Any help is greatly appreciated.

6
javascriptphpfacebookwebhooksfacebook-messenger
“I have created a .html file on the server” – and that’s the problem. Why do you think the error message says it received <html> <header> …, but expected something completely different? The challenge value is the only thing your URL is supposed to return; not an HTML document … - CBroe

6 Answers

29
votes

I came across a fix. I scrapped my js attempt and created a new php file with the following code:

<?php

$challenge = $_REQUEST['hub_challenge'];
$verify_token = $_REQUEST['hub_verify_token'];

if ($verify_token === 'my_token_code') {
echo $challenge;
}

I got this code from the first 10 minutes of this video: https://www.facebook.com/marketingdevelopers/videos/883648801749520/

6
votes

That code is node.js code and should be run on the server not in a <script> tag in your HTML.

Here's a simple walk through of setting up the messenger bot with node.js: https://github.com/voronianski/simon-le-bottle

Essentially you need to make sure you have a host that supports node.js applications and run it as such. It will not work inside of HTML.

4
votes

Not sure if this help, but the query parameters that FB send are with underscore not dot e.g. :

  • hub_verify_token
  • hub_mode
  • hub_challenge

P.S.

Sorry, this is valid for PHP

4
votes

If you're running this as a Node.js application, and you're coming from the The Facebook Quickstart Guide mentioned in the question, you'll have to point the webhook URL to [your-server-root]/webhook. Notice this part of the tutorial:

// Adds support for GET requests to our webhook
app.get('/webhook', (req, res) => {
    ...
    // Responds with the challenge token from the request
    res.status(200).send(challenge);
});
3
votes

@shane

webhook: function(req, res) {

   if (req.query['hub.verify_token'] === 'tokentoken') {
      res.send(req.query['hub.challenge']);
   } else {
      res.send('Error, wrong validation token');    
   }
}

Note sure what exactly you're doing. but this is what I did and it's working.

I've tested using ngrok server as I don't have a domain name and the callback URL is https://werwrwetwtw.ngrok.io/webhook

Hope this helps!

3
votes

I just resolved this problem by adding '/webhook' in the callback URL...