未被捕获的ReferenceError:auth未定义错误,但已经定义

时间:2020-05-01 15:10:16

标签: javascript firebase firebase-authentication

我遇到一个Uncaught ReferenceError: auth is not defined at auth.js:2奇怪的问题,但是我敢肯定它已经在index.html中定义了,因为SignUp和Login运行良好。但仍然在AuthState中显示错误。此代码有什么问题?

// AuthState
auth.onAuthStateChanged(user => {
  if (user) {
    console.log('user logged in: ', user);
  } else {
    console.log('user logged out');
  }
});

// Signup
const signupForm = document.querySelector('#signupForm');

if(signupForm)
{
  signupForm.addEventListener('submit', (e) => {
    e.preventDefault();

    const email = signupForm['signupemail'].value;
    const password = signupForm['signuppassword'].value;

    auth.createUserWithEmailAndPassword(email, password).then(cred => {
      console.log(cred.user);
      signupForm.reset();
    });
  });
}

// Login
const loginForm = document.querySelector('#loginForm');

if(loginForm)
{
  loginForm.addEventListener('submit', (e) => {
    e.preventDefault();

    const email = loginForm['loginemail'].value;
    const password = loginForm['loginpassword'].value;

    auth.signInWithEmailAndPassword(email, password).then((cred) => {
      console.log(cred.user);
      loginForm.reset();
    });
  });
}

这是我将这段代码放在正文部分底部的index.html页面代码。

<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-firestore.js"></script>

<script src="scripts/index.js"></script>
<script src="scripts/auth.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-analytics.js"></script>

<script>
  // Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    authDomain: "xxxxxxxxxxxxxxxxxxxxxx",
    databaseURL: "xxxxxxxxxxxxxxxxxxxxxx",
    projectId: "xxxxxxxxx",
    storageBucket: "xxxxxxxxxxxxx",
    messagingSenderId: "xxxxxxxxxxxxx",
    appId: "x:xxxxxxx:xxxx:xxxxxxxxxxxxxxxxx",
    measurementId: "G-xxxxxxxxxxx"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();

  const auth = firebase.auth();
  const db = firebase.firestore();
</script>

因此,上面是代码.................................................。 ................................................... ................................................... ................................................... ................................................... ................................................... ................................................... ................................................. < / p>

2 个答案:

答案 0 :(得分:0)

因此问题在于,您在定义变量之前先导入脚本。

应该是

<script>
  // Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    authDomain: "xxxxxxxxxxxxxxxxxxxxxx",
    databaseURL: "xxxxxxxxxxxxxxxxxxxxxx",
    projectId: "xxxxxxxxx",
    storageBucket: "xxxxxxxxxxxxx",
    messagingSenderId: "xxxxxxxxxxxxx",
    appId: "x:xxxxxxx:xxxx:xxxxxxxxxxxxxxxxx",
    measurementId: "G-xxxxxxxxxxx"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();

  const auth = firebase.auth(); // <----- this is where you define auth
  const db = firebase.firestore();
</script>
<script src="scripts/auth.js"></script> <!-- then you import the script -->

因此,首先定义auth,然后导入使用它的脚本。

答案 1 :(得分:0)

   <!-- Compiled and minified JavaScript -->
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js"></script>
<script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
        apiKey: "AIzaSyDBrgamDSO-o-3Pr_yRILe1ohsKRscxFK4",
        authDomain: "auth-thenetninja-8c561.firebaseapp.com",
        databaseURL: "https://auth-thenetninja-8c561.firebaseio.com",
        projectId: "auth-thenetninja-8c561",
        storageBucket: "auth-thenetninja-8c561.appspot.com",
        messagingSenderId: "807934937683",
        appId: "1:807934937683:web:5a0676e96cb8c4cb2cd4a6"
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);

    // Make auth and firestore references
    const auth = firebase.auth()
    const db = firebase.firestore()
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script src="scripts/auth.js"></script>
<script src="scripts/index.js"></script>