我想从firestore获取注册用户详细信息到html页面。当用户点击我的个人资料页面时,它会导航到下一个html页面,其中包含名字和姓氏等字段。这些字段已在注册页面输入。所以我想从firestore获取这些细节到下一个html页面。但我得到的错误就像"无法阅读财产' uid' of null"。如何解决这个问题这是我的html页面:
<!doctype html>
<html lang="en">
<head>
<title> deyaPay</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase-auth.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase-firestore.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<script>
var config = {
apiKey: "AIzaSyAJsAstiMsrB2QGJyoqiTELw0vsWFVVahw",
authDomain: "websignin-79fec.firebaseapp.com",
databaseURL: "https://websignin-79fec.firebaseio.com",
projectId: "websignin-79fec",
storageBucket: "",
messagingSenderId: "480214472501"
};
firebase.initializeApp(config);
</script>
<script src="https://www.gstatic.com/firebasejs/4.6.2/firebase-firestore.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<style>
// css goes here..
</style>
<script type="text/javascript">
function myProfile() {
var user = firebase.auth().currentUser.uid;
var db = firebase.firestore();
var docRef = db.collection("deyaPayusers").doc(user);
docRef.get().then(function(doc) {
if(doc && doc.exists) {
const myData = doc.data();
const ffname = myData.FirstName;
const llname = myData.LastName;
const phonen = myData.PhoneNumber;
document.getElementById("fname").value = ffname;
document.getElementById("lname").value = llname;
document.getElementById("phone").value = phonen;
}
}).catch(function(error) {
console.log("Got an error: ",error);
});
}
</script>
</head>
<body onload='myProfile()'>
<div class= "login-form">
<form method="post">
<h2>Profile</h2>
<div class="form-group">
<input type="text" name="firstname" id="fnmae" placeholder="FirstName" class="form-control" >
</div>
<div class="form-group">
<input type="text" name="lastname" id="lnmae" placeholder="LastName" class="form-control" >
</div>
<div class="form-group">
<input type="text" name="phone" id="phone" placeholder="PhoneNumber" class="form-control" >
</div>
</form>
</div>
</body>
</html>
答案 0 :(得分:4)
您的错误是Cannot read property 'uid' of null
。这意味着您在页面加载时加载myProfile()
此函数,到那时user
可能为空。从firebase获取auth详细信息会有滞后。试试这种方式
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
// User is signed in.
var db = firebase.firestore();
var docRef = db.collection("deyaPayusers").doc(user.uid);
docRef.get().then(function(doc) {
if(doc && doc.exists) {
const myData = doc.data();
const ffname = myData.FirstName;
const llname = myData.LastName;
const phonen = myData.PhoneNumber;
document.getElementById("fname").value = ffname;
document.getElementById("lname").value = llname;
document.getElementById("phone").value = phonen;
}
}).catch(function(error) {
console.log("Got an error: ",error);
});
} else {
// No user is signed in.
}
});