Home > OS >  Data is not getting updated in to firestore data base , according to the documentation the code is c
Data is not getting updated in to firestore data base , according to the documentation the code is c

Time：07-01

I am trying to learn react and as part of learning im trying to create a ecommerce app by react. This is my code.

I'm getting an error message in the console the screen shot also I'm attaching. Please help to solve this issue.

i have tried the documentation of firebase and am using firebase SDK version 8.3.

import React, { useContext, useState } from 'react'
import FirebaseContext from '../../store/FirebaseContext'
import {useHistory} from "react-router-dom"
import "./SignUp.css"

function SignUp() {
    const history=useHistory()
    const [firstname,setFirstname]=useState('')
    const [lastname,setLastname]=useState('')
    const [email,setEmail]=useState('')
    const [mobile,setMobile]=useState('')
    const [password,setPassword]=useState('')
    const {firebase} =useContext(FirebaseContext)

    const handleSubmit=(e)=>{
        e.preventDefault()
        firebase.auth().createUserWithEmailAndPassword(email,password).then((result)=>{
            result.user.updateProfile({displayName:firstname}).then(()=>{
             firebase.firestore().collection('user').doc("one").set({
                id:result.user.uid,
                username:firstname,
                firstname:firstname,
                lastname:lastname,
                phone:mobile
              })
              .then(()=>{
                history.push("/login")
              })
            })
        })
    }
  return (
<div>
<div className='signup-parent'>
        <img alt="signup-logo" className="signup-logo"src='https://t4.ftcdn.net/jpg/03/77/48/55/360_F_377485593_QHN6cjoNsNdOBoJNOwVRlFcHyZ0M9n3P.jpg'/>
        <form onSubmit={handleSubmit}>
           <input className='input' value={firstname} onChange={(e)=>setFirstname(e.target.value)}
           type="text" id="fname" placeholder="John" name='name'/>
           <br />
           <br/>
           <input className='input'value={lastname} onChange={(e)=>setLastname(e.target.value)} 
           type="text" id="lname" placeholder="Smith" name='name'/>
           <br/>
           <br/>
           <input className='input' value={email} onChange={(e)=>setEmail(e.target.value)}
           type="email" id="email" placeholder="[email protected]" name='email'/>
           <br/>
           <br/>
           <input className='input' value={mobile} onChange={(e)=>setMobile(e.target.value)}
           type="number" id="mobile" placeholder="1234567" name='mobile'/>
           <br/>
           <br/>
           <input className='input' value={password} onChange={(e)=>setPassword(e.target.value)}
           type="password" id="password" placeholder='*******' name='password'/>
           <br/>
           <br/>
           <br/>
           <button className='signup-button' type='submit'>SignUp</button>

        </form>
        <a className='login-from-signup' href='/login'>Login</a>
    </div>
</div>
  )
}

export default SignUp



  [1]: https://i.stack.imgur.com/BkFbz.png

Error Message in text form

Uncaught (in promise) FirebaseError: Missing or insufficient permissions.
    at new e (prebuilt-3c03a633-33a12d73.js:210:1)
    at prebuilt-3c03a633-33a12d73.js:11566:1
    at Y.<anonymous> (prebuilt-3c03a633-33a12d73.js:11508:1)
    at tb (index.esm.js:728:1)
    at E (index.esm.js:682:1)
    at push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.Z.sa (index.esm.js:2666:1)
    at qc (index.esm.js:1412:1)
    at sc (index.esm.js:1264:1)
    at push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.Ca (index.esm.js:1241:1)
    at push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.Xa (index.esm.js:1196:1)
    at tb (index.esm.js:728:1)
    at E (index.esm.js:682:1)
    at zd (index.esm.js:2041:1)
    at push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.Ua (index.esm.js:2037:1)
    at push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.za (index.esm.js:2033:1)
e @ prebuilt-3c03a633-33a12d73.js:210
(anonymous) @ prebuilt-3c03a633-33a12d73.js:11566
(anonymous) @ prebuilt-3c03a633-33a12d73.js:11508
tb @ index.esm.js:728
E @ index.esm.js:682
push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.Z.sa @ index.esm.js:2666
qc @ index.esm.js:1412
sc @ index.esm.js:1264
push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.Ca @ index.esm.js:1241
push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.Xa @ index.esm.js:1196
tb @ index.esm.js:728
E @ index.esm.js:682
zd @ index.esm.js:2041
push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.Ua @ index.esm.js:2037
push../node_modules/@firebase/webchannel-wrapper/dist/index.esm.js.h.za @ index.esm.js:2033
Promise.then (async)
(anonymous) @ SignUp.js:29
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6509
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6485
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6481
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
(anonymous) @ auth.esm.js:5177
(anonymous) @ auth.esm.js:5101
Dd @ auth.esm.js:2082
push../node_modules/@firebase/auth/dist/auth.esm.js.H.dispatchEvent @ auth.esm.js:2034
li @ auth.esm.js:4704
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Jc @ auth.esm.js:4659
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Vb @ auth.esm.js:4655
XMLHttpRequest.send (async)
ei @ auth.esm.js:4613
push../node_modules/@firebase/auth/dist/auth.esm.js.Ii.u @ auth.esm.js:5112
Si @ auth.esm.js:5077
(anonymous) @ auth.esm.js:5176
D @ auth.esm.js:1399
Yi @ auth.esm.js:5175
(anonymous) @ auth.esm.js:5662
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6509
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6485
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6481
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
(anonymous) @ auth.esm.js:5177
(anonymous) @ auth.esm.js:5101
Dd @ auth.esm.js:2082
push../node_modules/@firebase/auth/dist/auth.esm.js.H.dispatchEvent @ auth.esm.js:2034
li @ auth.esm.js:4704
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Jc @ auth.esm.js:4659
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Vb @ auth.esm.js:4655
XMLHttpRequest.send (async)
ei @ auth.esm.js:4613
push../node_modules/@firebase/auth/dist/auth.esm.js.Ii.u @ auth.esm.js:5112
Si @ auth.esm.js:5077
(anonymous) @ auth.esm.js:5176
D @ auth.esm.js:1399
Yi @ auth.esm.js:5175
(anonymous) @ auth.esm.js:5662
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
(anonymous) @ auth.esm.js:5177
(anonymous) @ auth.esm.js:5101
Dd @ auth.esm.js:2082
push../node_modules/@firebase/auth/dist/auth.esm.js.H.dispatchEvent @ auth.esm.js:2034
li @ auth.esm.js:4704
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Jc @ auth.esm.js:4659
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Vb @ auth.esm.js:4655
XMLHttpRequest.send (async)
ei @ auth.esm.js:4613
push../node_modules/@firebase/auth/dist/auth.esm.js.Ii.u @ auth.esm.js:5112
Si @ auth.esm.js:5077
(anonymous) @ auth.esm.js:5176
D @ auth.esm.js:1399
Yi @ auth.esm.js:5175
(anonymous) @ auth.esm.js:5662
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6509
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6509
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6485
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465
IndexedDB (async)
(anonymous) @ auth.esm.js:6481
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
(anonymous) @ auth.esm.js:5177
(anonymous) @ auth.esm.js:5101
Dd @ auth.esm.js:2082
push../node_modules/@firebase/auth/dist/auth.esm.js.H.dispatchEvent @ auth.esm.js:2034
li @ auth.esm.js:4704
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Jc @ auth.esm.js:4659
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Vb @ auth.esm.js:4655
XMLHttpRequest.send (async)
ei @ auth.esm.js:4613
push../node_modules/@firebase/auth/dist/auth.esm.js.Ii.u @ auth.esm.js:5112
Si @ auth.esm.js:5077
(anonymous) @ auth.esm.js:5176
D @ auth.esm.js:1399
Yi @ auth.esm.js:5175
(anonymous) @ auth.esm.js:5662
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
(anonymous) @ auth.esm.js:5162
(anonymous) @ auth.esm.js:5101
Dd @ auth.esm.js:2082
push../node_modules/@firebase/auth/dist/auth.esm.js.H.dispatchEvent @ auth.esm.js:2034
li @ auth.esm.js:4704
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Jc @ auth.esm.js:4659
push../node_modules/@firebase/auth/dist/auth.esm.js.k.Vb @ auth.esm.js:4655
XMLHttpRequest.send (async)
ei @ auth.esm.js:4613
push../node_modules/@firebase/auth/dist/auth.esm.js.Ii.u @ auth.esm.js:5112
Si @ auth.esm.js:5077
(anonymous) @ auth.esm.js:5161
D @ auth.esm.js:1399
Wi @ auth.esm.js:5160
Em @ auth.esm.js:8060
push../node_modules/@firebase/auth/dist/auth.esm.js.Am.getToken @ auth.esm.js:8076
(anonymous) @ auth.esm.js:8345
e.g @ auth.esm.js:1548
Sc @ auth.esm.js:1644
Oc @ auth.esm.js:1635
push../node_modules/@firebase/auth/dist/auth.esm.js.k.gc @ auth.esm.js:1625
xc @ auth.esm.js:1379
Promise.then (async)
uc @ auth.esm.js:1365
tc @ auth.esm.js:1354
Pc @ auth.esm.js:1613
zc @ auth.esm.js:1579
(anonymous) @ auth.esm.js:1400
a.onsuccess @ auth.esm.js:6465

CodePudding user response：

FirebaseError: Missing or insufficient permissions.

This error usually indicates that Firestore is protected by its default rules, which forbid any read or write operation to protect your database from unwanted access by others:

allow read, write: if false;

However, when actually using Firestore, these rules need to be adjusted to make Firestore accessible to your App. The most basic security rule is to only allow user accessing Firestore that have registered with your app:

allow read, write: if request.auth != null;

Upon further development of your App, you would want to use additional rules to restrict certain documents to certain users etc.

Firestore rules are explained here in more detail:

https://firebase.google.com/docs/firestore/security/get-started

https://firebase.google.com/docs/firestore/security/rules-structure

https://firebase.google.com/docs/firestore/security/rules-conditions

Page link：https//www.codepudding.com/os/460741.html

Prev:React Hook "useCustomHook" is called conditionally. React Hooks must be called in the exac
Next:React useEffect, only call after a state change
  • Related

About Us:  Contact Us      Terms of Service       Privacy Policy

Copyright © 2010-2023，Powered By CodePudding