https://github.com/nigeltiany/email-auth
https://github.com/nigeltiany/email-auth
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/nigeltiany/email-auth
- Owner: nigeltiany
- Created: 2017-07-24T01:20:30.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2017-07-28T20:26:43.000Z (almost 8 years ago)
- Last Synced: 2025-02-08T23:18:26.719Z (4 months ago)
- Language: JavaScript
- Size: 14.6 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
[Firebase](https://firebase.google.com/docs/web/setup) for [VueJS](https://vuejs.org/) -- email-auth plugin.
For Use with [VueFire](https://github.com/nigeltiany/vuefire) integration
## Install
```bash
npm install @vuefire/vuefire --save
npm install @vuefire/email-auth --save
```
## Usage
#### Configuration
```js
import VueFire from '@vuefire/vuefire'
import VueFire_Email_Auth from '@vuefire/email-auth'
Vue.use(VueFire, {
project: {
apiKey: "",
authDomain: ".firebaseapp.com",
databaseURL: "https://.firebaseio.com",
storageBucket: ".appspot.com",
messagingSenderId: "",
projectId: '',
},
mixins: [VueFire_Email_Auth]
})
// in components
this.$firebase.emailSignIn('', '').then(
(user) => {
},
(error) => {
}
);
// Or
this.$firebase.emailSignIn('', '',{ mutate: "vuexMutation" }).catch((error) => {
});
// Or a namespaced mutation : /mutationName
this.$firebase.emailSignIn('', '',{ mutate: "authentication/vuexMutation" }).catch((error) => {
});
// Or
this.$firebase.emailSignIn('', '', function(error, user) {
})
//Signing user up
this.$firebase.emailSignUp('', '').then(
(user) => {
},
(error) => {
}
);
// Or
this.$firebase.emailSignUp('', '',{ mutate: "vuexMutation" }).catch((error) => {
});
// Or
this.$firebase.emailSignUp('', '', function(error, user) {
})
```
### Vuex Usage
```js
Vue.use(VueFire, {
project: {
apiKey: "",
authDomain: ".firebaseapp.com",
databaseURL: "https://.firebaseio.com",
storageBucket: ".appspot.com",
messagingSenderId: "",
projectId: '',
},
mixins: [{
vuex: true,
sources: [VueFire_Email_Auth]
}]
})
// In components
export default {
data () {
return {
user: {
email: null,
password: null,
// Mutation to commit when/if login/signup is successful
mutate: 'authentication/authenticatedUser',
// Firebase path to save user. Defaults to 'users/'
firebasePath: 'users/',
// Function to call on validation error
error: this.error
}
}
},
methods: {
...mapActions('authentication', [
'emailSignUp',
'emailSignIn'
]),
error (error) {
// console.log(error)
// Or show toast message
}
}
}
// Vuex example
export default {
namespaced: true,
state: {
user: JSON.parse(localStorage.getItem('user')) || {}
},
getters: {
authUser (state) {
return state.user
}
},
mutations: {
authenticatedUser (state, authenticatedUser) {
Object.assign(state.user, authenticatedUser)
router.push({ path: '/' })
localStorage.setItem('user', JSON.stringify(authenticatedUser))
}
}
}
```
See [VueFire](https://github.com/nigeltiany/vuefire) Package Documentation on how to use mixins