我试图在我的laravel项目中使用Firebase signInWithPhoneNumber
函数实现电话验证。起初我遇到了一些问题,但我设法把所有东西放在一起,但现在尝试调用signInWithPhoneNumber
时抛出此错误:
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'verify')
at _verifyPhoneNumber (phone.ts:190:33)
at signInWithPhoneNumber (phone.ts:190)
字符串
我实际上不擅长js,所以我不能尝试调试这个错误,我试图搜索,但不能找到答案。我发现一个类似的问题github。
我的代码:
import {
initializeApp
} from 'https://www.gstatic.com/firebasejs/10.7.1/firebase-app.js'
import {
getAuth,
signInWithPhoneNumber,
RecaptchaVerifier
} from 'https://www.gstatic.com/firebasejs/10.7.1/firebase-auth.js'
const firebaseConfig = {
apiKey: "xxxxxxxxxx",
authDomain: "xxxxxxxxxxxxx",
projectId: "puxxxxxxxxxxxxx",
storageBucket: "pxxxxxxxxxxxxxxxxxxx",
messagingSenderId: "xxxxxxxxxxxxxx",
appId: "1:434692xxxxxxxxxxxxxxxxxx168c8757df",
measurementId: "G-xxxxxxxxxxxxxxxxxx"
};
const app = initializeApp(firebaseConfig)
const auth = getAuth()
window.onload = function() {
render();
};
function render() {
window.recaptchaVerifier = new RecaptchaVerifier(auth, 'recaptcha-container', {
'size': 'normal',
'callback': (response) => {
// reCAPTCHA solved, allow signInWithPhoneNumber.
// ...
console.log(response)
},
'expired-callback': () => {
// Response expired. Ask user to solve reCAPTCHA again.
// ...
}
});
window.recaptchaVerifier.render();
}
$('#send-code').on('click', function(e) {
e.preventDefault()
SendCode()
})
function SendCode() {
var number = $("#phone").val();
signInWithPhoneNumber(number, window.recaptchaVerifier).then(function(confirmationResult) {
window.confirmationResult = confirmationResult;
coderesult = confirmationResult;
console.log('success')
});
}
型
有人能告诉我我做错了什么吗?
2条答案
按热度按时间wkftcu5l1#
该错误可能源于不完整的reCAPTCHA验证或对电话号码或reCAPTCHA验证程序变量的不正确访问。请确保reCAPTCHA已完成,仔细检查变量范围和值,并验证SDK加载和DOM就绪。
nhn9ugyo2#
在render()函数的callback和deletred-callback中,记录消息以指示reCAPTCHA完成或过期:
字符串
在浏览器控制台中观察这些日志,以确保在登录尝试之前完成reCAPTCHA。
在调用signInWithPhoneNumber之前,记录number和window.recaptchaVerifier的值:
型
打开开发者控制台:在大多数浏览器中按F12键访问开发者控制台。检查网络选项卡:查找与加载Firebase SDK相关的错误或警告。
Move render():将render()调用放置在window.onload事件中或在DOM中呈现recaptcha-container元素之后。