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

使用validatePin() { const docRef = db.collection("passwords").doc("user"); docRef .get() .then(function(doc) { if (doc.exists) { console.log("Document data:", doc.data()); let password = this.doc.data; if (this.userInput === password) { this.isLoggedIn = true; // TODO: do whatever needs to happen once the user is logged in } } else { console.log("No such document!"); } }) .catch(function(error) { console.log("Error getting document:", error); }); }。特别是，Firebase.auth()方法/监听器将在页面加载后触发。您希望处理用户/ UI访问的位置。

Answer 2

存在一些问题，但主要是因为文档是从Firestore异步加载的。解决方案是将需要文档的所有代码移动到加载文档后调用的ob.nextInt()。所以：

then()

在Firestore中检索文档并根据用户的条目进行验证

2 个答案: