Я слежу за примерами Firebase, использующими веб-аутентификацию, и не могу войти, если использую текстовые поля и кнопки внутри элемента формы html.
Вот HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Login</title>
<script src="https://www.gstatic.com/firebasejs/5.0.1/firebase.js"></script>
</head>
<body>
<form id="app">
<input type="email" id="txtEmail" placeholder="Email">
<input type="password" id="txtPassword" placeholder="Password">
<button id="btnLogin">Login</button>
<button id="btnSignUp">SignUp</button>
<button id="btnLogout">Logout</button>
</form>
</body>
<script src="app.js"></script>
</html>
И JS:
(function() {
// Initialize Firebase
const config = {
apiKey: "MyData",
authDomain: "MyData",
databaseURL: "MyData",
projectId: "MyData",
storageBucket: "MyData",
messagingSenderId: "MyData"
};
firebase.initializeApp(config);
const txtEmail = document.getElementById('txtEmail');
const txtPassword = document.getElementById('txtPassword');
const btnLogin = document.getElementById('btnLogin');
const btnSignUp = document.getElementById('btnSignUp');
const btnLogout = document.getElementById('btnLogout');
btnLogin.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));
});
btnSignUp.addEventListener('click', e => {
const email = txtEmail.value;
const pass = txtPassword.value;
const auth = firebase.auth();
const promise = auth.createUserWithEmailAndPassword(email, pass);
promise
.catch(e => console.log(e.message));
});
btnLogout.addEventListener('click', e => {
firebase.auth().signOut();
});
firebase.auth().onAuthStateChanged(firebaseUser => {
if(firebaseUser){
console.log(firebaseUser);
btnLogout.style.display = 'block';
} else {
console.log('not logged in');
btnLogout.style.display = 'none';
}
});
}());
Когда я пытаюсь войти в систему, в журнале консоли появляется следующее сообщение:
"Похоже, вы используете сборку разработкиFirebase JS SDK. При развертывании приложений Firebase в рабочей среде рекомендуется импортировать только отдельные компоненты SDK, которые вы собираетесь использовать. Для сборок CDN они доступны следующим образом (замените именем компонента - то есть auth)., база данных и т. д.): https://www.gstatic.com/firebasejs/5.0.0/firebase-.js"
Если переместить входы и кнопки за пределы элемента формы, логин работает отлично.
Чего мне не хватает?