How to work with Authentication in Framework7 Vue

Question

I am using the latest Framework7 Vue Webpack starter pack.

My default page ('/') is a login page. My plan was to run a xhr request as soon as any page in the app is requested.

So I tried putting the isLoggedIn() call in the onF7Ready(f7). If logged in I thought I would use this to take the user to the home screen - self.$f7router.navigate('/home/'); else I would take the user to the Login page. Then I learnt the $f7router is only accessible in the Route Components.
Then I thought I will put the isLoggedIn() check in each and every page's pageInit(). So I tried putting that code in the login.vue file in on: { pageInit(e) { The $f7router is available here but the self.$f7router.navigate('/home/'); does not work. The same self.$f7router.navigate('/home/'); however does work if I use it in one of the dummy methods in the same login.vue file.

Even if the above code did work, there must be a better way of checking if a user is logged in and then do things in a much better way then I am doing. All my routes except for the ('/') require authentication.

Can anyone tell me how I should approach this very standard issue? Thanks a lot.

I am checking in ajax requests, if a receive an 401 it means that I should redirect to login page. — Edgard Leal
– Edgard Leal, Commented Feb 26, 2018 at 19:41

Manish Pradhan · Accepted Answer · 2018-05-23 20:50:19Z

1

I found that the self.$f7router.navigate is not available in the pageInit(), however, it is available in the pageBeforeIn() and other functions that follows the pageInit().

Sidenote: I found pageInit() to be quite dangerous for this particular use case because everytime you navigate to this page the page is going to run the AJAX request not just when the App is first accessed.

answered May 23, 2018 at 20:50

Manish Pradhan

1,19810 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Joeme Over a year ago

The documentation is a real struggle for this. Everything I need to do is a battle.

Collectives™ on Stack Overflow

How to work with Authentication in Framework7 Vue

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related