The idea of register form is
- add user email and password to firebase auth, this is successful, then
- add new document using their
uid
as document id and insert street field and value; toprofile
collection, failed without error.
The user and email are added to the auth users in firebase console, but the document writing still unsuccessfull with no error on the console either.
Been scratching my head for awhile.
Here's my code
<template>
<v-form @submit.prevent="createUser">
<v-text-field
v-model="register.email"
label="Email"
required
/>
<v-text-field
v-model="register.password"
label="Password"
required
/>
<v-text-field
v-model="register.street"
required
label="Street"
/>
<v-btn
type="submit"
>
Register
</v-btn>
</v-form>
</template>
<script>
import Vue from 'vue'
import { createUserWithEmailAndPassword, onAuthStateChanged } from 'firebase/auth'
import { doc, setDoc } from 'firebase/firestore'
import { auth, db } from '~/plugins/firebase.js'
export default Vue.extend({
data () {
return {
register: {}
}
},
methods: {
async createUser () {
await createUserWithEmailAndPassword(
auth,
this.register.email,
this.register.password
).catch((error) => {
console.log(error.code)
console.log(error.message)
})
onAuthStateChanged(
auth,
(user) => {
if (user) {
const ref = doc(db, 'profile', user.uid)
const document = {
street: this.register.street
}
try {
setDoc(ref, document)
} catch (e) {
alert('Error!')
console.error(e.code)
console.error(e.message)
}
}
}
)
}
}
})
</script>
firestore rule with no restriction
rules_version = '2';
service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read;
allow write;
}
}
}
CodePudding user response:
Try like following:
async createUser () {
await createUserWithEmailAndPassword(
auth,
this.register.email,
this.register.password
)
.then((user) => {
this.writeToFirestore(user)
})
.catch((error) => {
console.log(error.code)
console.log(error.message)
})
},
async writeToFirestore(user) {
if (user) {
const ref = doc(db, 'profile', user.id)
const document = {
street: this.register.street
}
try {
setDoc(ref, document)
} catch (e) {
alert('Error!')
console.error(e.code)
console.error(e.message)
}
}
},