2

I made a controller in laravel for WhatsApp webhook authentication, run it locally and use ngrok to connect it with WhatsApp webhook, it won't connect, it said "The Callback url or verify token could not be validated", but when I deploy it on heroku it working normally. Is there any special config so I can connect it locally using ngrok ? or is there any alternative solution?

Blue Moon
  • 31
  • 9

4 Answers4

1

You need to follow the steps provided in ngrok documentation, https://ngrok.com/docs/integrations/whatsapp/webhooks,

I am not sure which step you are missing or have a problem with, but as per the error "The Callback url or verify token could not be validated", your deployed code for webhook is not valid as per the provided guideline in WhatsApp webhook docs.

Make sure you have set the same verification code in the code and webhook verification when you configure!

turivishal
  • 34,368
  • 7
  • 36
  • 59
  • and what should I do? – Blue Moon Aug 11 '22 at 03:17
  • Ngrok is supposed to provide you with an HTTPS domain. – Guillermo Verón Oct 21 '22 at 22:03
  • @GuillermoVerón I know but I just answered the exact requirement of the WhatsApp Business API. – turivishal Oct 22 '22 at 04:19
  • 2
    I just tried this with ngrok just now and it's never accepted: always says the ngrok url is found to be malicious. The moment I switched to my hosted site, it works. But it is terribly inefficient to having to repeatedly move files to hosting just for testing during development. Would love to know a solution. Stumbled on https://ngrok.com/partners/whatsapp but it's not free. – user1729972 Nov 28 '22 at 17:40
1

Went through the same issue and it seems that WhatsApp Cloud API considers NgRok malicious, and won't accept it as a callback webhook endpoint.

Yaser Marey
  • 51
  • 6
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jan 25 '23 at 19:15
1

According to the ngrok docs, you need to have a pro or enterprise license for validation to work. A free alternate solution for anyone that may need it (at least at the time of writing) is Cloudflare tunnel. Just read the docs or you can watch this video(CLI version) or video(dashboard version) to help you set it up. You will need to have a domain though.

Emmanuel
  • 413
  • 1
  • 6
  • 13
0

I just managed to do it and I would like to explain how for others. First I logged into the ngrok website and claimed my free domain. Under the Edges tab you can than start a tunnel which will give give you a command, copy + paste that command into your ngrok.exe like usual.

After you've done that, tt will print your endpoint in the webapp after you click on refresh.

With that running setup your endpoint in your backend-project.

api.php:

Route::get('webhook', [WhatsappController::class, 'index']);

WhatsappController.php

public function index(Request $request): string
    {
        $hubChallenge = $request->input('hub_challenge');
        $verifyToken = $request->input('hub_verify_token');

        if ($request->input('hub_mode') === 'subscribe' && $verifyToken === env('VERIFY_TOKEN')) {
            return $hubChallenge;
        } else {
            return response('Bad Request', 400);
        }
    }

in my .env file I created a variable called VERIFY_TOKEN and gave it a value. Enter that same value into the verify token field in the meta.developer portal when creating an endpoint.

For the Callback Url use the url that ngrok gave you together with (in my case) /api/webhook.

After all these steps it should work locally.

PioPio
  • 23
  • 3