Question

我正在使用Firebase作为后端来构建vue.js应用。我已经设置了身份验证和路由防护。我还将会话的持久性设置为firebase.persistance.LOCAL，但是，每当刷新页面时，关闭选项卡或浏览器并返回时，我都会被重定向到登录页面。

这是我的Firebase配置：

 <script type="text/x-kendo-template" id="other">
 <div>
   //before paste look like this
   //<label class="switch"><input type="checkbox" onclick="Action_Clicked(this)" checked=checked checked=checked checked/><span class="slider round"></span></label>
      
   //after paste become this         
   <label class="switch"><input type="checkbox" onclick="Action_Clicked(this)" checked=checked checked=checked checked=checked checked=checked checked=checked checked=checked checked=checked/><span class="slider round"></span></label>

 </div>
      

 </script>

这是我登录用户的方式：

import * as firebase from "firebase";

var firebaseConfig = {
  ....
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);

export const auth = firebase.auth();
export const firestore = firebase.firestore();
export const storage = firebase.storage();

这是我的路线守卫：

auth.setPersistence(firebase.auth.Auth.Persistence.LOCAL)
                .then(function() {
                  auth
                    .signInWithEmailAndPassword(self.email, self.password)
                    .then(function() {
                      self.$router.push("/management");
                    })
                    .catch(function(error) {
                      self.errors = error;
                      document.getElementById("signInLoader").style.display =
                        "none";
                    });
                })
                .catch(function(error) {
                  self.errors = error;
                  document.getElementById("signInLoader").style.display =
                    "none";
                });

Answer 1

我更改了routeguard来监视auth初始化，然后检查currentUser。

router.beforeEach((to, from, next) => {
    auth.onAuthStateChanged(function(user) {
        const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
        if (!requiresAuth) {
            next()
        } else if (requiresAuth && user) {
            next()
        } else {
            next("/signin");
        }
    });
});

在Vue应用中刷新Firebase注销页面

1 个答案: