Używanie recaptcha z Firebase

Question

Co zaskakujące - jeszcze więcej, gdy obie są produktami Google - są informacje, które mogę znaleźć na temat integracji programu Recaptcha z Firebase pod numerem no. Czy to możliwe? Jeśli nie, to w jaki sposób mogę zweryfikować ludzi w aplikacji Firebase, która nie ma auth?

Answer 1

Właśnie opublikowałem tutorial blog o tym, jak zintegrować reCAPTCHA w witrynie internetowej za pomocą Firebase Hosting, aby udostępniać treść i funkcje w chmurze dla Firebase do sprawdzania poprawności odpowiedzi otrzymanej z reCAPTCHA. Sama funkcja wygląda tak, zakładając, że token odpowiedź jest odbierana za pośrednictwem łańcucha zapytania:

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.") 
    }) 
}) 

Answer 2

Jest to dość stary post, ale tutaj jest odpowiedź dla wyszukiwarki Google facet jak ja. To teraz wbudowany, i bardzo łatwy do skonfigurowania:

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() 

Jak tuananh wspomina, upewnij się dodać <div id="recaptcha"></div>.