New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

beforeEnter fire twice on root path ('/') after async `next` call #725

Closed
billouboq opened this Issue Oct 5, 2016 · 5 comments

Comments

Projects
None yet
4 participants
@billouboq
Contributor

billouboq commented Oct 5, 2016

Hi, when my app start, beforeEnter is fired twice, dunno why. And since i'm using socket, after this all my sockets emit twice. Am I missing something ?

I'm using vue 2.

UPDATE: this seems to occur because of asynchronous calls in my function.
See this fiddle: https://jsfiddle.net/1xb99hz6/

This is my code :

import Vue from 'vue'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import socket from './services/socket'
import {auth} from './services/auth'

// import vue componenets
import App from './routes/app.vue'
import Signin from './routes/signin.vue'
import Signup from './routes/signup.vue'

// init all the things
Vue.use(VueRouter);
Vue.use(VueResource);
Vue.use(socket.install);

// config routes
const router = new VueRouter({
   base: __dirname,
   linkActiveClass: 'active-link',
   routes: [
     { path: '/', beforeEnter: auth, component: App},
     { path: '/signin', component: Signin },
     { path: '/signup', component: Signup }
   ]
});

// mount a root Vue instance
new Vue({
   router,
}).$mount('#app');

And my auth function :

function auth(to, from, next) {

   console.log('in auth');

   // if no internet connection
   if (!navigator.onLine) {
      next('/nointernet');
   }

   const jwt = getToken();

   if (jwt) {

      // send the jwt
      socket.emit('authenticate', {token: jwt}) ;

      // if user is authenticated
      socket.once('authenticated', (token) => {
         next();
      });

      // if user is unauthorized
      socket.once('unauthorized', () => {
         removeToken(tokenKey);
         next('/signin');
      });

   } else {
      next('/signin');
   }

}

in console I get 'in auth' twice in a really short amount of time.

@fnlctrl

This comment has been minimized.

Show comment
Hide comment
@fnlctrl

fnlctrl Oct 5, 2016

Member

Hi, thanks for filling this issue. Please follow the Issue Reporting Guidelines and provide a live example on jsfiddle, codepen etc. Thanks!

Member

fnlctrl commented Oct 5, 2016

Hi, thanks for filling this issue. Please follow the Issue Reporting Guidelines and provide a live example on jsfiddle, codepen etc. Thanks!

@fnlctrl fnlctrl added the need repro label Oct 5, 2016

@billouboq

This comment has been minimized.

Show comment
Hide comment
@billouboq

billouboq Oct 5, 2016

Contributor

The problem occur when I'm doing an asynchronous call in the beforeEnter function.
See this fiddle: https://jsfiddle.net/1xb99hz6/

Contributor

billouboq commented Oct 5, 2016

The problem occur when I'm doing an asynchronous call in the beforeEnter function.
See this fiddle: https://jsfiddle.net/1xb99hz6/

@fnlctrl

This comment has been minimized.

Show comment
Hide comment
@fnlctrl

fnlctrl Oct 5, 2016

Member

Strangely, it happens only on the root path, and only after async next call.. https://jsfiddle.net/2qv45zcq/
Looks like a bug to me.

Member

fnlctrl commented Oct 5, 2016

Strangely, it happens only on the root path, and only after async next call.. https://jsfiddle.net/2qv45zcq/
Looks like a bug to me.

@fnlctrl fnlctrl added bug 2.x and removed need repro labels Oct 5, 2016

@fnlctrl fnlctrl changed the title from beforeEnter fire twice to beforeEnter fire twice on root path ('/') after async `next` call Oct 5, 2016

@yyx990803

This comment has been minimized.

Show comment
Hide comment
@yyx990803

yyx990803 Oct 13, 2016

Member

Closed via #735 - thanks for fixing your own issue! :D

Member

yyx990803 commented Oct 13, 2016

Closed via #735 - thanks for fixing your own issue! :D

@activey

This comment has been minimized.

Show comment
Hide comment
@activey

activey Jun 22, 2017

Still happens to me, vue 2.3.4, vue-router 2.6.0

activey commented Jun 22, 2017

Still happens to me, vue 2.3.4, vue-router 2.6.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment