javascript - 检索 Firestore 中的文档并根据用户的输入进行验证

Question

我能够使用 JavaScript 成功检索 Firebase Firestore 中的文档。但想要根据用户的输入验证该文档，以便验证该个人进入该页面。

使用控制台日志，我发现我已检索到记录，但它与最终用户输入的文本不匹配。

这是如何实现的？

我正在使用Vuejs。并希望用密码保护一页。

在 jsfiddle 中:https://jsfiddle.net/oL4bondy/4/

HTML

        <div v-if="!isLoggedIn">
      <h2>Please log in first.</h2>
      <div class="form-group">
        <form @submit.prevent="validatePin">
          <div class="form-group">
            <input v-model="password" type="text" class="form-control" placeholder="Enter password">
          </div>
            <div class="form-group">
              <button type="submit" class="btn btn-primary text-center">Submit</button>
            </div>
        </form>
      </div>
    </div>

JS

    export default {
  name: "add-post",

  data() {
    return {
      password: "",
      isLoggedIn: ""
    };
  },
  methods: {
    validatePin() {
      const docRef = db.collection("passwords").doc("user");
      docRef
        .get()
        .then(function(doc) {
          if (doc.exists) {
            console.log("Document data:", doc.data());
          } else {
            console.log("No such document!");
          }
        })
        .catch(function(error) {
          console.log("Error getting document:", error);
        });
      let password = this.doc.data;
      if (this.userInput === password) {
        this.isLoggedIn = true;
      }
    }
  }
};

Answer 1

为此使用 Firebase.auth()。特别是， .onAuthStateChanged 方法/监听器将在页面加载后触发。这就是您要处理用户/UI 访问的地方。