从我的 vue 应用程序访问 firebase 时，addAuthTokenListener 不是一个函数

Posted 2023-02-22

【中文标题】从我的 vue 应用程序访问 firebase 时，addAuthTokenListener 不是一个函数

【英文标题】：addAuthTokenListener is not a function when accessing firebase from my vue app

【发布时间】：2021-09-01 20:56:55

【问题描述】：

我在每个尝试从 firebase 访问数据的 vue 组件页面上都提出了问题。它仅在获取或添加数据到 firebase 时发生。在每个功能和错误仍然存​​在之前，我已经尝试使用firebase.default，但每次我在开发中重新加载页面而不是在生产中时都会消失。我已经尝试将firebase从我当前的8.6.7降级到8.6.5和8.2.0，并且每次都删除节点模块文件夹，但错误仍然存​​在。

main.js

    import Vue from 'vue';
import App from './App.vue';
import firebase from 'firebase/app';
import 'firebase/auth'
import router from './router';
import store from './store/index';
import vuetify from './plugins/vuetify';
import ErrorAlert from "@/components/ErrorAlert";

Vue.config.productionTip = false;
Vue.component('app-alert', ErrorAlert)
let app;

const firebaseConfig = 
    apiKey: "********",
    authDomain: "********",
    databaseURL: "********",
    projectId: "********",
    storageBucket: "********",
    messagingSenderId: "********",
    appId: "********",
    measurementId: "********"
;

firebase.initializeApp(firebaseConfig);

firebase.auth().onAuthStateChanged(user => 
    store.dispatch('auth/fetchUser', user).then();
    if (!app) 
        new Vue(
            store,
            router,
            vuetify,
            render: h => h(App)
        ).$mount('#app');
    
);

路由器/index.js

  import Vue from 'vue';
import VueRouter from 'vue-router';
import firebase from 'firebase/app';
import 'firebase/auth'
import Login from '../views/Login';
import Dashboard from '../views/admin/Dashboard';
import AddFurniture from "../views/admin/AddFurniture";
import DeleteFurniture from "../views/admin/DeleteFurniture";
import SignUp from "@/views/SignUp";

Vue.use(VueRouter)

const routes = [
    
        // Login Page
        path: '/',
        name: '/',
        component: Login
    ,
    
        // Login Page
        path: '/signup',
        component: SignUp
    ,
    
        path: '/admin',
        component: () => import('../views/admin/AdminHome.vue'),
        children: [
            path: '', component: Dashboard,
            path: 'add-furniture', component: AddFurniture,
            path: 'delete-furniture', component: DeleteFurniture,
        ],
        meta: 
            requiresAuth: true,
            title: "Furniture Catalog",
            icon: "/logo.png"
        
    
]

const router = new VueRouter(
    mode: 'history',
    routes
);

router.beforeEach((to, from, next) => 
    if (to.matched.some(record => record.meta.requiresAuth)) 
        if (!(firebase.auth().currentUser)) 
            next(name: '/');
         else 
            next();
        
     else if (to.path == '/') 
        if (firebase.auth().currentUser) 
            next(path: '/admin');
         else 
            next();
        
     else 
        next();
    
);

export default router

控制台错误：

【问题讨论】：

你能提供更多细节吗？我可以看到许多问题，但我没有看到对 addTokenListener 的任何引用

初始化 firebase 时可能会出现问题，但是我正在遵循您所看到的确切文档。我用控制台错误更新了帖子

【参考方案1】：

最新的 firebase 版本 8.6.8 修复了该问题。只需在 package.json 上更新您的 firebase npm