Question

我正在尝试使用Firebase API创建网络登录

我查看了他们的示例代码，它似乎工作正常但现在却没有。

网上已经剪下了密钥，我刚刚删除它们以确保安全

快速启动登录状态标签也没有更新。

<script src="https://www.gstatic.com/firebasejs/3.2.0/firebase.js"></script>
<script>
  var config = {
  apiKey: "*****",
  authDomain: "project-*****.firebaseapp.com",
  databaseURL: "https://project-*****.firebaseio.com",
  storageBucket: "project--*****.appspot.com",
 };
firebase.initializeApp(config);
</script>

<!DOCTYPE html>
<html>
<head>

<script type="text/javascript">
function toggleSignIn() {
  if (firebase.auth().currentUser) {
    firebase.auth().signOut();
  } else {
    var email = document.getElementById('email').value;
    var password = document.getElementById('password').value;
    if (email.length < 4) {
      alert('Please enter an email address.');
      return;
    }
    if (password.length < 4) {
      alert('Please enter a password.');
      return;
    }
    firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
      var errorCode = error.code;
      var errorMessage = error.message;
      if (errorCode === 'auth/wrong-password') {
        alert('Wrong password.');
      } else {
        alert(errorMessage);
      }
      console.log(error);
      document.getElementById('quickstart-sign-in').disabled = false;
    });
  }
  document.getElementById('quickstart-sign-in').disabled = false;
}

function initApp() {
  firebase.auth().onAuthStateChanged(function(user) {
    if (user) {
      document.getElementById('quickstart-sign-in-status').textContent = 'Signed in';
    } else {
      document.getElementById('quickstart-sign-in-status').textContent = 'Signed out';
    }
    document.getElementById('quickstart-sign-in').disabled = false;
  });

  document.getElementById('quickstart-sign-in').addEventListener('click', toggleSignIn, false);
}

 window.onload = function() {
  initApp();
 };
</script>

<title>Fitness Schedule</title>
<link rel="stylesheet" href="css/style.css"/> 

</head>
<body>
<div class="container">
  <div class="main">
    <h2>Fitness Schedule</h2><hr/>

     <center><label id="quickstart-sign-in-status"></label></center><br><br>

     <label>User Name :</label></br>
     <input type="text" name="email" id="email"/></br>

     <label>Password :</label></br>
     <input type="password" name="password" id="password"/></br>

     <button id="quickstart-sign-in" name="signin">Sign In</button>

  </div>
 </div>
</body>

Answer 1

我只是把你的代码放在plnkr中 - ＆gt; http://plnkr.co/edit/7qa2H6m9VRhmkd7b1X8D 它似乎工作正常，

<!DOCTYPE html>
<html>

<head>
  <link data-require="bootstrap-css@4.0.0-alpha.2" data-semver="4.0.0-alpha.2" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css" />
  <link rel="stylesheet" href="style.css" />
  <script src="https://www.gstatic.com/firebasejs/3.2.0/firebase.js"></script>
  <script src="script.js"></script>
  <script type="text/javascript">
    var config = {
      YOUR-CONFIG-GOES-HERE
    };
    firebase.initializeApp(config);


    function toggleSignIn() {
      if (firebase.auth().currentUser) {
        firebase.auth().signOut();
      } else {
        var email = document.getElementById('email').value;
        var password = document.getElementById('password').value;
        if (email.length < 4) {
          alert('Please enter an email address.');
          return;
        }
        if (password.length < 4) {
          alert('Please enter a password.');
          return;
        }
        firebase.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
          var errorCode = error.code;
          var errorMessage = error.message;
          if (errorCode === 'auth/wrong-password') {
            alert('Wrong password.');
          } else {
            alert(errorMessage);
          }
          console.log(error);
          document.getElementById('quickstart-sign-in').disabled = false;
        });
      }
      document.getElementById('quickstart-sign-in').disabled = false;
    }

    function initApp() {
      firebase.auth().onAuthStateChanged(function(user) {
        if (user) {
          document.getElementById('quickstart-sign-in-status').textContent = 'Signed in';
        } else {
          document.getElementById('quickstart-sign-in-status').textContent = 'Signed out';
        }
        document.getElementById('quickstart-sign-in').disabled = false;
      });

      document.getElementById('quickstart-sign-in').addEventListener('click', toggleSignIn, false);
    }

    window.onload = function() {
      initApp();
    };
  </script>
  <title>Fitness Schedule</title>
  <link rel="stylesheet" href="css/style.css" />
</head>

<body>
  <div class="container">
    <div class="main">
      <h2>Fitness Schedule</h2>
      <hr />
      <center>
        <label id="quickstart-sign-in-status"></label>
      </center>
      <br />
      <br />
      <label>User Name :</label>
      <br />
      <input type="text" name="email" id="email" />
      <br />
      <label>Password :</label>
      <br />
      <input type="password" name="password" id="password" />
      <br>
      <br>
      <button class="btn btn-primary" id="quickstart-sign-in" name="signin">Sign In</button>
    </div>
  </div>
</body>

</html>

FireBase JS和HTML AUTH

1 个答案: