Login user information does not appear using Firebase!

2

I'm developing a Web-app! In the case, a chat, however, a chat with new and legal functions!

I'm doing just for learning and fun!

In the app, I'm using Firebase, to create Logins, Notifications etc!

My question is: I am not able to display user information on the site!

Pages

  • Index:
<div class="ui secondary  menu">
    <button onclick="window.location.href = '/';" class="ui inverted button">Home </button>

    <div class="right menu">
        <button id="sair-but" class="ui inverted button">Sair </button>
    </div>
</div>

<br>
<br>
<br>

<center>

    <div class="ui container">

        <div class="ui negative message" style="display: none;">
            <i class="close icon"></i>
            <div class="header">Você não está logado! </div>
            <p>Você precisa estar logado para enviar mensagens. </p>
        </div>

        <!-- Logue-se -->
        <div id="logue-se">
            <h1>Logue-se usando suas redes sociais:</h1>

            <!--  Botoes de login -->
            <button class="ui google plus button" id="login-but"><i class="google icon"></i> Google </button>

        </div>

        <div id="perfil">

            <img class="ui medium circular image" id="img-perfil" width="100px" height="100px">

            <h2 id="name"></h2>

        </div>
    </div>

</center>



<script src="https://www.gstatic.com/firebasejs/3.4.0/firebase.js"></script><scriptsrc="https://apis.google.com/js/platform.js" async defer></script>

<script src="login.js"></script>
  • Login.js:
  $("#login-but").click(function() {

      var provider = new firebase.auth.GoogleAuthProvider();
      provider.addScope('https://www.googleapis.com/auth/plus.login');

      firebase.auth().signInWithRedirect(provider);
      firebase.auth().getRedirectResult().then(function(result) {
          if (result.credential) {
              // This gives you a Google Access Token. You can use it to access the Google API.
              var token = result.credential.accessToken;
              // ...
          }
          // The signed-in user info.
          var user = result.user;
      }).catch(function(error) {
          // Handle Errors here.
          var errorCode = error.code;
          var errorMessage = error.message;
          // The email of the user's account used.
          var email = error.email;
          // The firebase.auth.AuthCredential type that was used.
          var credential = error.credential;
          // ...
      });

  });

  var user = firebase.auth().currentUser;

  if (user != null) {
      user.providerData.forEach(function(profile) {
          console.log("Sign-in provider: " + profile.providerId);
          console.log("  Provider-specific UID: " + profile.uid);
          console.log("  Name: " + profile.displayName);
          console.log("  Email: " + profile.email);
          console.log("  Photo URL: " + profile.photoURL);
      });
  }

  // Logout
  $("#sair-but").click(function() {
      firebase.auth().signOut().then(function() {
          // Sign-out successful.
      }, function(error) {
          // An error happened.
      });

  });

If my question is not yet clear, please let me know!

Always when I try to get the user information, it does not give an error. It just does not do anything! It's as if the user is not logged in.

I want to make a system that when the user is not logged in! The% div appears as%.

And if you're logged in, you'll see his picture and the name below!

    
asked by anonymous 28.09.2016 / 06:29

1 answer

2

First you have to start the application with

firebase.initializeApp({
    apiKey: "<API_KEY>",
    authDomain: "<PROJECT_ID>.firebaseapp.com",
    databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
    storageBucket: "<BUCKET>.appspot.com",
  });

Then you have to add (at least) the auth script since you are using it in firabse.auth() .

<script src="https://www.gstatic.com/firebasejs/3.4.0/firebase-auth.js"></script>

And of course, do not forget to refer to jQuery (in the example you do not have it either). Finally, if you enter a console.log(error) in the function of .catch() it will be easy to continue to realize what is happening:)

    
28.09.2016 / 14:00