I have been attempting to log in with Facebook using Firebase. How can I save user information such as email and username to the database? Additionally, I am unsure of what steps to take next when users engage in activities like ordering products on my website. For instance, if they log in again via Facebook at a later time, how would I, as an admin, retrieve data from the database? (@nuxtjs/firebase) What should be my next course of action? This is something I have been researching for the past 2 months.
<template>
<div>
<v-row no-gutters>
<v-col cols="12" md="12" sm="12">
<v-card>
<v-row no-gutters>
<v-col cols="12" md="12" sm="12">
<v-form @submit.prevent="loginUser">
<v-col cols="12" md="12" sm="12">
<v-text-field
type="email"
error-count=""
placeholder=""
label="email"
append-icon="mdi-email"
v-model="email"
outlined
color
></v-text-field>
</v-col>
<v-col cols="12" md="12" sm="12">
<v-text-field
type="email"
error-count=""
placeholder=""
label="password"
append-icon="mdi-password"
v-model="password"
outlined
color
></v-text-field>
</v-col>
<v-col cols="12" md="12" sm="12">
<v-btn medium elevation="" color="primary" type="submit"
>login</v-btn
>
</v-col>
<v-col cols="12" md="12" sm="12">
<v-btn
medium
elevation=""
color="primary"
type=""
@click="loginWithFacebook()"
>log in with facebook</v-btn
>
</v-col>
</v-form>
</v-col>
</v-row>
</v-card>
</v-col>
</v-row>
</div>
</template>
<script>
export default {
data: () => ({
email: '',
password: '',
}),
methods: {
async loginUser() {
try {
const response = await this.$fire.auth.signInWithEmailAndPassword(
this.email,
this.password
)
console.log(response)
this.$router.replace({ name: 'test1' })
} catch (e) {
console.error(e)
}
},
async loginWithFacebook() {
try {
const provider = new this.$fireModule.auth.FacebookAuthProvider()
let authData = await this.$fire.auth.signInWithPopup(provider)
console.log(authData)
} catch (e) {
console.error(e)
}
},
},
}
</script>
<style></style>