I want to use Firebase Auth to ONLY verify phone numbers and then get the verified phone number to a PHP variable so that i can later add it to mysql database. I have the code for the Auth working but i cant figure out a way to get to pass the verified number to PHP. I should add that I am a beginner level programmer, just learnt a little PHP and MSQL, still learning Javascript and the reason I am dodging manupulating the data through Firebase, though i usually read through code(more so if well commented) and try to understand it. Any HELP will be much appreciated.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Link</title>
<script src="https://www.gstatic.com/firebasejs/5.9.0/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "AIzaSyCOVkS44nYchsZff_jZX8_UboE-bc_W-ig",
authDomain: "uservice256.firebaseapp.com",
databaseURL: "https://uservice256.firebaseio.com",
projectId: "uservice256",
storageBucket: "uservice256.appspot.com",
messagingSenderId: "802480679143"
};
firebase.initializeApp(config);
</script>
<script src="https://cdn.firebase.com/libs/firebaseui/2.3.0/firebaseui.js"> </script>
<link type="text/css" rel="stylesheet" href="https://cdn.firebase.com/libs/firebaseui/2.3.0/firebaseui.css" />
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="container">
<h3> LINK </h3>
<div id="loading">Loading...</div>
<div id="loaded" class="hidden">
<div id="main">
<div id="user-signed-in" class="hidden">
<div id="user-info">
<div>Service Providers now reach you on</div>
<div id="phone"></div> <!--Phone displays here-->
<div class="clearfix"></div>
</div><!--close user-info-->
<p>
<a href='clientProfile.php'>
<button>Continue</button>
</a
</p>
<p>
<button id="sign-out"> Change number</button>
</p>
</div><!--close id=user-signed-in-->
<div id="user-signed-out" class="hidden">
<div id="firebaseui-spa">
<h3> get Services:</h3>
<div id="firebaseui-container"> </div>
</div>
</div><!--close id=hidden -->
</div><!--close id=main -->
</div><!--close id=loaded -->
</div><!--close id=container -->
<script src="app.js"></script>
</body>
</html>
/**app.JS
* @return {!Object} The FirebaseUI config.
*/
function getUiConfig() {
return {
'callbacks': {
// Called when the user has been successfully signed in.
'signInSuccess': function(user, credential, redirectUrl) {
handleSignedInUser(user);
// Do not redirect.
return false;
}
},
// Opens IDP Providers sign-in flow in a popup.
'signInFlow': 'popup',
'signInOptions': [
// The Provider you need for your app. We need the Phone Auth
// firebase.auth.TwitterAuthProvider.PROVIDER_ID,
{
provider: firebase.auth.PhoneAuthProvider.PROVIDER_ID,
recaptchaParameters: {
//size: getRecaptchaMode()
type: 'image',
size: 'invisible',
badge: 'bottomleft'
}
}
],
// Terms of service url.
'tosUrl': 'https://www.google.com'
};
}
// Initialize the FirebaseUI Widget using Firebase.
var ui = new firebaseui.auth.AuthUI(firebase.auth());
/**
* Displays the UI for a signed in user.
* @param {!firebase.User} user
*/
var handleSignedInUser = function(user) {
document.getElementById('user-signed-in').style.display = 'block';
document.getElementById('user-signed-out').style.display = 'none';
document.getElementById('name').textContent = user.displayName;
document.getElementById('email').textContent = user.email;
document.getElementById('phone').textContent = user.phoneNumber;
if (user.photoURL){
document.getElementById('photo').src = user.photoURL;
document.getElementById('photo').style.display = 'block';
} else {
document.getElementById('photo').style.display = 'none';
}
};
/**
* Displays the UI for a signed out user.
*/
var handleSignedOutUser = function() {
document.getElementById('user-signed-in').style.display = 'none';
document.getElementById('user-signed-out').style.display = 'block';
ui.start('#firebaseui-container', getUiConfig());
};
// Listen to change in auth state so it displays the correct UI for when
// the user is signed in or not.
firebase.auth().onAuthStateChanged(function(user) {
document.getElementById('loading').style.display = 'none';
document.getElementById('loaded').style.display = 'block';
user ? handleSignedInUser(user) : handleSignedOutUser();
});
/**
* Deletes the user's account.
*/
var deleteAccount = function() {
firebase.auth().currentUser.delete().catch(function(error) {
if (error.code == 'auth/requires-recent-login') {
// The user's credential is too old. She needs to sign in again.
firebase.auth().signOut().then(function() {
// The timeout allows the message to be displayed after the UI has
// changed to the signed out state.
setTimeout(function() {
alert('Please sign in again to delete your account.');
}, 1);
});
}
});
};
/**
* Initializes the app.
*/
var initApp = function() {
document.getElementById('sign-out').addEventListener('click', function() {
firebase.auth().signOut();
});
document.getElementById('delete-account').addEventListener(
'click', function() {
deleteAccount();
});
};
window.addEventListener('load', initApp);
Aucun commentaire:
Enregistrer un commentaire