web-dev-qa-db-fra.com

Utilisation de recaptcha avec Firebase

Étonnamment, encore plus lorsque les deux sont des produits Google, il y a non informations que je peux trouver sur la façon d'intégrer Recaptcha à Firebase. Est-ce même possible? Sinon, que puis-je utiliser pour valider les humains sur une application Firebase sans authentification?

firebaserecaptcha
19
Sergi Mansilla

Il s'agit d'un article assez ancien, mais voici la réponse pour les autres chercheurs Google comme moi. Il est maintenant intégré et super facile à configurer:

window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha', {
  'callback': (response) => {
    // reCAPTCHA solved, allow signInWithPhoneNumber.
    // ...
  },
  'expired-callback': () => {
    // Response expired. Ask user to solve reCAPTCHA again.
    // ...
  }
})
window.recaptchaVerifier.render()

Comme le mentionne tuananh, assurez-vous d'ajouter un <div id="recaptcha"></div>.

10
Alan Grainger

Je viens de publier un blog tutoriel sur la façon d'intégrer reCAPTCHA dans un site Web en utilisant Firebase Hosting pour servir le contenu et les fonctions cloud pour Firebase pour valider la réponse reçue de reCAPTCHA. La fonction elle-même ressemble à ceci, en supposant que le jeton de réponse est reçu via la chaîne de requête:

const functions = require('firebase-functions')
const rp = require('request-promise')

exports.checkRecaptcha = functions.https.onRequest((req, res) => {
    const response = req.query.response
    console.log("recaptcha response", response)
    rp({
        uri: 'https://recaptcha.google.com/recaptcha/api/siteverify',
        method: 'POST',
        formData: {
            secret: 'PASTE_YOUR_SECRET_CODE_HERE',
            response: response
        },
        json: true
    }).then(result => {
        console.log("recaptcha result", result)
        if (result.success) {
            res.send("You're good to go, human.")
        }
        else {
            res.send("Recaptcha verification failed. Are you a robot?")
        }
    }).catch(reason => {
        console.log("Recaptcha request failure", reason)
        res.send("Recaptcha request failed.")
    })
})
5
Doug Stevenson