Проблемы с учебником по веб-разработке Firebase на codelabs.com

Question

Я новичок в веб-разработке Firebase и в настоящее время использую этот сайт , чтобы изучить его. Учебное пособие было достаточно простым, но есть несколько страниц, которые я не понимаю.

1. На странице 7 в учебном пособии показано, как подключить авторизацию Google с помощью кнопки. Я знаком с кодом HTML, где каждая кнопка имеет свое собственное событие onclick для вызова функции в javascript. Однако в коде нет события onclick, которое запускается, и все же кнопка вызывает функцию. Как это возможно?

//Button code in index.html
<button hidden id="sign-out" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-color-text--white">
Sign-out
</button> 

//Script to call the function in main.js
function signIn() {
    var provider = new firebase.auth.GoogleAuthProvider();
    firebase.auth().signInWithPopup(provider);
} 

На странице 8 мне не удалось отобразить вывод на этой странице. Я скопировал и вставил код в свой основной файл. js, но пока ничего не произошло. Я не уверен, как отладить это.

Может кто-нибудь посоветовать мне, как продолжить это? Спасибо.

Answer 1

Ваш первый вопрос: когда вы запустили кодовую метку, вы создали копию стартового проекта. Этот проект содержит реализацию по умолчанию signIn:

// Signs-in Friendly Chat.
function signIn() {
  alert('TODO: Implement Google Sign-In');
  // TODO 1: Sign in Firebase with credential from the Google user.
}

. Затем вы реализуете этот метод на шаге 7, чтобы он стал:

// Signs-in Friendly Chat.
function signIn() {
  // Sign in Firebase using popup auth and Google as the identity provider.
  var provider = new firebase.auth.GoogleAuthProvider();
  firebase.auth().signInWithPopup(provider);
}

This Используемый вами метод signIn уже подключен к кнопке в HTML в стартовом проекте, с этим кодом в нижней части main.js:

signInButtonElement.addEventListener('click', signIn);