Adding Firebase Google Log-in Information to External Database

Question

I'm working on a web application, and currently, am trying to send some Firebase google authentication information (basically, an e-mail or unique ID) into an external database hosted on my server. The problem is, I have no idea what I should be storing in my database, or where I should be writing code to store it. Normally, when I'd create a form in HTML, I would write up some PHP to send things like a name and store it. But this seems to be a lot more complicated. I'm a very new beginner with Firebase, PHP, etc., and could really use some guidance. Below is my Firebase code for logging in with a Google account. I apologize if I've made a mistake somewhere in it -- I've been using tutorials online as a start.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>

  <script src="https://www.gstatic.com/firebasejs/4.12.0/firebase.js"></script>
  <script>
  // Initialize Firebase
  var config = {
    apiKey: [apiKey goes here]
    authDomain: [authDomain goes here]
    databaseURL: [database URL goes here]
    projectId: [projectID goes here]
    storageBucket: [""]
    messagingSenderId: [""]
  };
  firebase.initializeApp(config);
</script>

<script src="https://cdn.firebase.com/libs/firebaseui/2.6.3/firebaseui.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.firebase.com/libs/firebaseui/2.6.3/firebaseui.css" />
<script type="text/javascript">
  // FirebaseUI config.
  var uiConfig = {
    signInSuccessUrl: 'loggedIn.html',
    signInOptions: [
      // Leave the lines as is for the providers you want to offer your users.
      firebase.auth.GoogleAuthProvider.PROVIDER_ID
    ],
    // Terms of service url.
    tosUrl: '<your-tos-url>'
  };

  // Initialize the FirebaseUI Widget using Firebase.
  var ui = new firebaseui.auth.AuthUI(firebase.auth());
  // The start method will wait until the DOM is loaded.
  ui.start('#firebaseui-auth-container', uiConfig);
</script>

  <body>
    <div id="firebaseui-auth-container"></div>
  </body>
</html>

score 2 · Accepted Answer · answered Apr 02 '18 at 17:02

2

If you want to store user specific data accessible by authenticated users (php or otherwise), you basically need to send the user ID token to your server every time you need to access user specific data. You get the ID token from a current user:

firebase.auth().currentUser.getIdToken().then(function(idToken) {
  // You can now pass this ID token to your endpoint for manipulating user data.
})...

On your server, you would verify the ID token and get the user's uid. Here is an example how to do so: How to verify firebase ID token with PHP(JWT)?

You can get the sub field from the decoded token to get the user's uid.

answered Apr 02 '18 at 17:02

bojeil

29,642
4
69
76

Where in my code would I add that `firebase.auth().currentUser.getIdToken().then(function(idToken)` part? And inside of the brackets, I would use something like HTTPS POST call to the server, correct? – Apr 03 '18 at 03:22
1

You add that call before sending requests to your server. Let's say a user wants to check their cart information before checkout, they would POST a request to your server and pass their ID token along. Correct. Inside the function, you would HTTPS POST. – bojeil Apr 03 '18 at 03:32
So I would place it after `var ui = new firebaseui.auth.AuthUI(firebase.auth());`? Or perhaps inside of the `signInOptions` bracket? I'm suppose I'm just not really sure at what point I should be getting the token/sending requests to my server. – Apr 03 '18 at 03:39
You call it whenever you need it. – bojeil Apr 03 '18 at 04:31

Adding Firebase Google Log-in Information to External Database

1 Answers1