Блог

Согласно этой статье, https://cloud.google.com/identity-platform/docs/web/mfa, Я пытаюсь настроить невидимую рекапчу. Однако функция обратного вызова, похоже, не срабатывает. Идея в том, что я хочу, чтобы рекапча срабатывала при нажатии кнопки и отправляла код через функцию обратного вызова, но она не работает.

Я пытаюсь активировать рекапчу с помощью следующей функции, связанной с кнопкой с идентификатором «код-кнопка».

 sendCode () {         
         
        const recaptchaVerifier = new firebase.auth.RecaptchaVerifier('code-button', {
            'size': 'invisible',            
            'callback': () => {
              // reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
            //   onSolvedRecaptcha();
            console.log("captcha is working")
            }            
           })
               
            recaptchaVerifier.render()               
                 
     }
 

Когда я нажимаю кнопку, чтобы отключить функцию sendCode, обратный вызов внутри recaptchaVerifier, похоже, не работает. Предполагается, что console.log «captcha работает», но это не так, когда я проверяю консоль.

Я действительно получаю следующие проблемы в консоли, но я не уверен, действительно ли они блокируют обратный вызов или заставляют перепросмотр не работать:

Укажите, следует ли отправлять файл cookie в межсайтовом запросе, указав его атрибут SameSite

Использование SharedArrayBuffer ограничено изолированными сайтами перекрестного происхождения

Я даже не знаю, как их разрешить. Согласно некоторым статьям, они кажутся проблемами, которые могут быть решены только самим Google.

Кто — нибудь знает, почему это происходит?

Спасибо.

Я сам решил эту проблему, отбросив обратный вызов изнутри, и вместо этого я просто вызвал recaptchaVerifier из другой функции по мере необходимости. Например:

Во-первых, инициализируйте рекапчу и визуализируйте ее:

 const recaptchaVerifier = new firebase.auth.RecaptchaVerifier('code-button', {
                    size: 'invisible'                    
                   });

                   recaptchaVerifier.render()
 

Затем просто позвоните туда, где это необходимо:

 user.multiFactor.getSession().then((multiFactorSession) => {
                    // Specify the phone number and pass the MFA session.
                    const phoneInfoOptions = {
                      phoneNumber: this.state.number,
                      session: multiFactorSession
                    };
                    
                    const phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
                    // Send SMS verification code.
                    return phoneAuthProvider.verifyPhoneNumber(
                        phoneInfoOptions, recaptchaVerifier);
                  })