Аутентификация Firebase успешно, но возвращает нулевого пользователя (Web)

У меня возникли проблемы с аутентификацией пользователей с использованием firebase с помощью моего веб-приложения. Всякий раз, когда я пытаюсь войти в систему, firebase.auth(). SignInWithEmailAndPassword (email, pass); вызывается функция, запрос выполняется успешно, и запускается прослушиватель authStateChanged. Однако внутри получателя firebaseUser всегда возвращает null.Аутентификация Firebase успешно, но возвращает нулевого пользователя (Web)

Я пробовал разместить веб-приложение с личного сервера и разрешить доступ к домену для моей базы данных firebase.

У меня также есть приложение для Android, которое работает безупречно с той же БД.

Вот мой код:

(function() { 

    // Initialize Firebase 
     var config = { 
     //CONFIG INFORMATION HERE 
     }; 
     firebase.initializeApp(config); 

     // Get elements 

     const txtEmail = document.getElementById('username'); 
     const txtPassword = document.getElementById('password'); 
     const loginButton = document.getElementById('loginButton'); 

     loginButton.addEventListener('click', e => { 

     const email = txtEmail.value; 
     const pass = txtPassword.value; 
     const auth = firebase.auth(); 

     const promise = auth.signInWithEmailAndPassword(email, pass); 
     promise.catch(e => console.log(e.message)); 
     }); 

     firebase.auth().onAuthStateChanged(firebaseUser => { 
     if(firebaseUser){ 
      console.log(firebaseUser); 
     } 
     else{ 
      console.log('not logged in'); 
     } 
     }) 

}());

Логин HTML:

<!DOCTYPE html> 
    <html> 
    <head> 
     <title>Athlete Buddy Login</title> 
     <meta http-equiv="content-type" content="text/html;charset=utf-8"> 
     <link rel="stylesheet" type="text/css" href="allStyleSheet.css"> 
     <link rel="stylesheet" type="text/css" href="login.css"> 
     <link rel="icon" type="image/gif" href="pictures/ABLogo.png"> 
     <script src="https://www.gstatic.com/firebasejs/live/3.1/firebase.js"></script> 

</head> 
<body> 
<nav> 
    <a href="#">Home</a> 
    <a href="#">Login</a> 
    <a href="#">Features</a> 
</nav> 

<img src="pictures/loginArt.png" id="loginTitle"> 

<div id="loginFormDiv"> 
    <form id="loginForm"> 
     Username: <input id="username" class="field" type="text" name="Username"> <br><br> 
     Password: <input id="password" class="field" type="Password" name="Password"> <br><br> 
     <input id="loginButton" type="submit" value="Login"> 
     <a id="createAccountButton" href="#">Create Account</a> 
     <a id="forgotPassword" href="http://www.youtube.com/watch?v=dQw4w9WgXcQ">forgot password?</a> 
    </form> 
</div> 

<script src="login.js"></script> 

</body> 
</html>

источник

2017-02-12 Kyle Behiels

Это кажется маловероятным, что авторизация не удастся, не вызывая 'поймать()'. Можете ли вы настроить воспроизведение в jsbin, чтобы я мог посмотреть? –

https://jsbin.com/sonenup/1 –

Я никогда раньше не использовал jsbin, скорее всего, я сделал это неправильно. Логин: [email protected] password: testing123 –

Вы что-нибудь из вашей кнопки обработчик щелчка не возвращает, ни предупреждения, это по умолчанию поведение. Это означает, что кнопка отправляет форму, что приводит к обновлению страницы.

Решение достаточно простое:

loginButton.addEventListener('click', e => { 
    e.preventDefault(); 

    const email = txtEmail.value; 
    const pass = txtPassword.value; 
    const auth = firebase.auth(); 

    const promise = auth.signInWithEmailAndPassword(email, pass); 
    promise.then(u => console.log(u)); 
    promise.catch(e => console.log(e.message)); 

    return false; 
    });

Я также добавил дополнительный then() обработчик, что делает его легче увидеть, что он работает. Но вы действительно должны обрабатывать состояние auth в onAuthStateChanged, как вы уже делали.

Смотрите эту jsbin: https://output.jsbin.com/waxixe/1

источник

2017-02-13 00:00:35

Ты мужчина. Это исправило это! –

Аутентификация Firebase успешно, но возвращает нулевого пользователя (Web)

ответ

Смежные вопросы