Firebase_otp_sms:使用JavaScript在Firebase上通过电话号码对OTP进行身份验证资源-CSDN文库

共2个文件

php：1个

gitattributes：1个

Hack

5星 · 超过95%的资源需积分: 10 64 浏览量 2021-03-25 13:22:32 上传评论收藏 2KB ZIP 举报

资源详情

资源评论

资源推荐

收起资源包目录

Firebase_otp_sms-main.zip （2个子文件）

Firebase_otp_sms-main

.gitattributes 66B

firebase_sms_otp.php 4KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Firebase SMS OTP</title> <meta name="author" content="Marut Jaipala"> <meta name="description" content="You can read more details on website https://firebase.google.com/docs/auth/web/phone-auth?authuser=0 enjoy">  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous"> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script>   <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-app.js"></script>  <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-analytics.js"></script>  <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-auth.js"></script> <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-firestore.js"></script> <script src="https://www.google.com/recaptcha/api.js"></script> </head> <body class="container text-center"> <div class="row justify-content-center"> <div class="col-md-6 pt-4 "> <h1>Firebase Authenticate With SMS OTP </h1> <div class="input-group mt-4"> <input id="phoneNumber" type="text" class="form-control" placeholder="+66987654321" aria-label="Example text with button addon" aria-describedby="button-addon1"> <button type="button" class="btn btn-primary" onclick="phonesend()">Request_OTP</button> </div> <div id="recaptcha-container"></div> <p></p> <div id="show_vertify_otp" class="input-group mt-4 " style="display: none;"> <input type="number" id="OTP" class="form-control" placeholder="" aria-label="Example text with button addon" aria-describedby="button-addon1"> <button type="button" class="btn btn-success" onclick="vertify_otp()">Submit</button> </div> </div> </div> </body> </html> <script> // firebaseConfig is https://console.firebase.google.com/u/0/project/ -> Project setting { IN TITLE : Your apps } var firebaseConfig = { apiKey: "", authDomain: "", projectId: "", storageBucket: "", messagingSenderId: "", appId: "", measurementId: "" }; firebase.initializeApp(firebaseConfig); firebase.analytics(); firebase.auth().languageCode = 'th'; window.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container'); function phonesend() { const phoneNumber = document.getElementById("phoneNumber").value; const appVerifier = recaptchaVerifier; firebase.auth().signInWithPhoneNumber(phoneNumber, appVerifier) .then((confirmationResult) => { console.log(confirmationResult) window.confirmationResult = confirmationResult; document.getElementById('recaptcha-container').style.display = 'none'; document.getElementById('show_vertify_otp').style.display = 'block'; }).catch((error) => { console.log(error.message) }); } function vertify_otp() { const code = document.getElementById("OTP").value; confirmationResult.confirm(code).then((result) => { console.log(result) const user = result.user; alert('OTP VERTIFY : Welcome :' + user); }).catch((error) => { console.log(error.message) }); } </script>