FireBase Recaptcha verification failed - SITE_MISMATCH

Question

I am using firebase identity toolkit from googleapi for phone verification on web. I have handled recaptcha for website too using site key and went to do post request, but I am not able to send sms to mobile as I am stucked for past 2 days on same problem sadly. here is following steps I did

1. Enable phone authentication mechanism from firebase console.
2. Enable web api key for same firebase project.
3. Go to firebase recapcha admin and enable my host website to get repactha token.

Finally I did post request using api key from firebase console and captcha token from front end side and phone number in my server side. But the json response I am getting is this as below.

 {'error': {'code': 400, 
'message': 'CAPTCHA_CHECK_FAILED : Recaptcha verification failed - SITE_MISMATCH', 'errors': [{'message': 'CAPTCHA_CHECK_FAILED : Recaptcha verification failed - SITE_MISMATCH', 'domain': 
'global', 'reason': 'invalid'}]}}

Here is some code I made my hand dirty.

def _factory(self):
    firebase_api_key = settings.FIREBASE_API_KEY

    params = (
        ('key', firebase_api_key),
    )

    json_data = {
        'phoneNumber': self._data['phone_number'],
        'recaptchaToken': self._data['recaptchaToken'],
    }

    secret_key = 'MY_SERVER_SIDE_RECAPTCHA_SITE_KEY'
    headers = {"Content-Type": "application/x-www-form-urlencoded"}
    data = {
        'secret': secret_key,
        'response': self._data['recaptchaToken']
    }

    url = 'https://www.google.com/recaptcha/api/siteverify'

    captacha_verify = requests.post(url, headers=headers, params=data)
    print(captacha_verify.json())
    headers = {
        'content-type': 'application/json',
    }

    new = requests.post('https://identitytoolkit.googleapis.com/v1/accounts:sendVerificationCode',params=params,json=json_data,headers = headers)

    print(new.json())

Any help feedbaack will be very useful. I am not using firebase Database. I just want to minimize cost of sms to verify user via phone number.

Answer 1

Long story short - there seems to be a very confusing difference between what works in the regular recaptcha pattern (i.e. put the recaptcha element on a website >>> get a recaptcha token >>> validate it on the Google API and get its score >>> decide what to do with it at the server side) and the second case where one is forced to use recaptcha in order MFA to work in the Google Identity platform.

While the reCAPTCHA enterprise documentation seems quite exhaustive the one related to Google Identity omits a lot of details - hence the above problem.

So, in the case when one wants to integrate reCaptcha for the sake of making MFA work in Google Identity, if they create a site key from the relevant place in the GCP console:

the key will simply not work and they will be getting the error message "CAPTCHA_CHECK_FAILED : Recaptcha verification failed - SITE_MISMATCH".

The solution is to:

1. Go to your project (e.g. the one where the Identity stuff is supposed to run) and visit the Identity Platform console as shown:

2. Copy the hash

3. Send a get request to https://identitytoolkit.googleapis.com/v1/recaptchaParams?key=[THE_HASH_YOU_HAVE_COPIED_ABOVE]

4. You will receive a dictionary with 3 key-value pairs

5. There is a recaptchaSiteKey inside and this is the one you need to use as a site key on your web pages from which you will be invoking the MFA workflow steps

Thanks to my colleagues who worked on that in order to unravel the mystery!

Answer 2

I believe you need to use the getRecaptchaParam() method in order to generate the site-key.

The result will be a json containing the key. Which you then pass into the request if I'm not mistaken.

{
  "recaptchaSiteKey": string
}

Answer 3

If you need on backend side, you can use this https://identitytoolkit.googleapis.com/v1/recaptchaParams?key=api_key