aofdev / vue-firebase-auth-vuex Goto Github PK
View Code? Open in Web Editor NEWVue Firebase🔥 Authentication with Vuex
License: MIT License
Vue Firebase🔥 Authentication with Vuex
License: MIT License
Hi,
I like your App a good point to start but as a new user to Vue, I'll make an offer to add the Email Link Authentication.
That isn't hard, where to put the callback though?
If in the main.js the guard will not allow access to the /profile
so user will be back to the /signin
then the answer from Firebase will come and the user will be redirected back to the /profile
.
Setting the flag loading: false
doesn't work either because the user almost certainly will be back to the new tab by the email link.
This is how it works in my app right now. Doesn't looks right.
As I said I'm new to Vue I'll be glad to see a right way to add this way of Authentication.
There is no forgot password option in this template. It would be very helpful if that is also in place. Thank you.
Description:
Hi,
First, thanks for your code.
However there is actually a user-case witch create a bug:
0- Open the dev chrome console
1- SignIn (or SignUp) via google auth
2- When you reach /profile, refresh your browser (F5), you'll be auto-signed to the app
3- Click on logout when you are on the profile/ route.
This error display: Cannot read property 'name' of null
I think the logout make a change somewhere and the component try to reload but as we have destroy the session, the name became null
Can you help me ?
Thanks
Hello!
I saw that the app has many icons. I cannot find the tool for generating them.
Can you help me/us?
Thanks!
First I want to thank you for this good starting point!
I have a problem with the routing system here, as I cannot reach /profile or /dashboard (whatever restricted route given), as it redirects me always to the "/" home page.
I do not want to have a seperate /signup and /signIn page, so I store them in a dialog and the login and signup itself works fine and as expected.
Somehow, within the auth-guard.js I set in the else condition next('/') instead next('/signup') (as I dont want to have this extra route)
Is this maybe causing the problem? I did not make any other changes to your code, besides this one.
If you need further information, please contact me.
Here is my router index.js and auth-guard.js
import Vue from 'vue'
import Router from 'vue-router'
import AuthGuard from './auth-guard'
const Home = () => import('@/components/Home')
const Profile = () => import('@/components/User/Profile')
const Dashboard = () => import('@/components/Dashboard/Layout')
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/dashboard',
name: 'Dashboard',
component: Dashboard,
beforeEnter: AuthGuard
},
{
path: '/profile',
name: 'Profile',
component: Profile,
beforeEnter: AuthGuard,
children: [
{
path: '/settings',
name: 'Settings',
component: () => import('@/components/User/Settings')
}
]
}
],
mode: 'history'
})
and the auth-guard.js
import {store} from '../store'
export default (to, from, next) => {
if (store.getters.user) {
next()
} else {
next('/')
}
}
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.