Firebase beforeeach() fires a lot of times (Vue app)
I am building posts app using Firebase and Vue js. I have some issue:
My router:
import Vue from 'vue'
import Router from 'vue-router'
import Dashboard from '@/components/Dashboard'
import Login from '@/components/Login'
import SignUp from '@/components/SingUp'
import RecentPosts from '@/components/RecentPosts';
import firebase from 'firebase'
Vue.use(Router)
let router = new Router(
routes: [
...... some routes
path: '/recentPosts',
name: 'RecentPosts',
component: RecentPosts,
meta:
requireAuth: true
]
)
router.beforeEach((to, from, next) =>
let currentUser = firebase.auth().currentUser;
let requiresAuth = to.matched.some(r => r.meta.requiresAuth);
console.log("CURRENTUSER",currentUser);
if(!currentUser && requiresAuth)
next('Login');
else if(currentUser && !requiresAuth)
next('Dashboard');
else if (currentUser && requiresAuth)
next();
else
next();
);
export default router;
After i go to /recentPosts my function beforeeach fires so many times so that it blocks my app.
Why I cant access /recentPosts ? I have logged in user so it should resolve my rout, but it's not.
else if (currentUser && requiresAuth)
next();
It should resolbe my '/recentsposts' route, but it isn't
javascript firebase vue.js firebase-authentication vue-router
asked Nov 14 '18 at 12:17
lukluk
345
add a comment |
I am building posts app using Firebase and Vue js. I have some issue:
My router:
import Vue from 'vue'
import Router from 'vue-router'
import Dashboard from '@/components/Dashboard'
import Login from '@/components/Login'
import SignUp from '@/components/SingUp'
import RecentPosts from '@/components/RecentPosts';
import firebase from 'firebase'
Vue.use(Router)
let router = new Router(
routes: [
...... some routes
path: '/recentPosts',
name: 'RecentPosts',
component: RecentPosts,
meta:
requireAuth: true
]
)
router.beforeEach((to, from, next) =>
let currentUser = firebase.auth().currentUser;
let requiresAuth = to.matched.some(r => r.meta.requiresAuth);
console.log("CURRENTUSER",currentUser);
if(!currentUser && requiresAuth)
next('Login');
else if(currentUser && !requiresAuth)
next('Dashboard');
else if (currentUser && requiresAuth)
next();
else
next();
);
export default router;
After i go to /recentPosts my function beforeeach fires so many times so that it blocks my app.
Why I cant access /recentPosts ? I have logged in user so it should resolve my rout, but it's not.
else if (currentUser && requiresAuth)
next();
It should resolbe my '/recentsposts' route, but it isn't
javascript firebase vue.js firebase-authentication vue-router
asked Nov 14 '18 at 12:17
lukluk
345
add a comment |
I am building posts app using Firebase and Vue js. I have some issue:
My router:
import Vue from 'vue'
import Router from 'vue-router'
import Dashboard from '@/components/Dashboard'
import Login from '@/components/Login'
import SignUp from '@/components/SingUp'
import RecentPosts from '@/components/RecentPosts';
import firebase from 'firebase'
Vue.use(Router)
let router = new Router(
routes: [
...... some routes
path: '/recentPosts',
name: 'RecentPosts',
component: RecentPosts,
meta:
requireAuth: true
]
)
router.beforeEach((to, from, next) =>
let currentUser = firebase.auth().currentUser;
let requiresAuth = to.matched.some(r => r.meta.requiresAuth);
console.log("CURRENTUSER",currentUser);
if(!currentUser && requiresAuth)
next('Login');
else if(currentUser && !requiresAuth)
next('Dashboard');
else if (currentUser && requiresAuth)
next();
else
next();
);
export default router;
After i go to /recentPosts my function beforeeach fires so many times so that it blocks my app.
Why I cant access /recentPosts ? I have logged in user so it should resolve my rout, but it's not.
else if (currentUser && requiresAuth)
next();
It should resolbe my '/recentsposts' route, but it isn't
javascript firebase vue.js firebase-authentication vue-router
asked Nov 14 '18 at 12:17
lukluk
345
I am building posts app using Firebase and Vue js. I have some issue:
My router:
import Vue from 'vue'
import Router from 'vue-router'
import Dashboard from '@/components/Dashboard'
import Login from '@/components/Login'
import SignUp from '@/components/SingUp'
import RecentPosts from '@/components/RecentPosts';
import firebase from 'firebase'
Vue.use(Router)
let router = new Router(
routes: [
...... some routes
path: '/recentPosts',
name: 'RecentPosts',
component: RecentPosts,
meta:
requireAuth: true
]
)
router.beforeEach((to, from, next) =>
let currentUser = firebase.auth().currentUser;
let requiresAuth = to.matched.some(r => r.meta.requiresAuth);
console.log("CURRENTUSER",currentUser);
if(!currentUser && requiresAuth)
next('Login');
else if(currentUser && !requiresAuth)
next('Dashboard');
else if (currentUser && requiresAuth)
next();
else
next();
);
export default router;
After i go to /recentPosts my function beforeeach fires so many times so that it blocks my app.
Why I cant access /recentPosts ? I have logged in user so it should resolve my rout, but it's not.
else if (currentUser && requiresAuth)
next();
It should resolbe my '/recentsposts' route, but it isn't
javascript firebase vue.js firebase-authentication vue-router
javascript firebase vue.js firebase-authentication vue-router
asked Nov 14 '18 at 12:17
lukluk
345
asked Nov 14 '18 at 12:17
lukluk
345
asked Nov 14 '18 at 12:17
lukluk
345
asked Nov 14 '18 at 12:17
lukluk
345
asked Nov 14 '18 at 12:17
lukluk
345
345
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
This is probably because you have a typo at require(s):
path: '/recentPosts',
name: 'RecentPosts',
component: RecentPosts,
meta:
requireAuth: true // <- without "s" at the end of require
]
})
router.beforeEach((to, from, next) =>
let currentUser = firebase.auth().currentUser;
let requiresAuth = to.matched.some(r => r.meta.requiresAuth); // <- with an "s" at the end of requires
answered Nov 14 '18 at 12:29
Renaud TarnecRenaud Tarnec
11.6k21531
add a comment )
router.beforeEach((to, from, next) =>
let currentUser = firebase.auth().currentUser;
let requiresAuth = to.matched.some(r => r.meta.requiresAuth); // <- with an "s" at the end of requires
answered Nov 14 '18 at 12:29
Renaud TarnecRenaud Tarnec
11.6k21531
answered Nov 14 '18 at 12:29
Renaud TarnecRenaud Tarnec
11.6k21531
answered Nov 14 '18 at 12:29
Renaud TarnecRenaud Tarnec
11.6k21531
answered Nov 14 '18 at 12:29
Renaud TarnecRenaud Tarnec
11.6k21531
11.6k21531
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53300065%2ffirebase-beforeeach-fires-a-lot-of-times-vue-app%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
