为什么不能向Firebase数据库添加信息?

时间:2019-02-28 22:24:22

标签: javascript html firebase firebase-realtime-database

我正在尝试将Web应用程序连接到Firebase数据库,但不会将信息添加到其中。我希望用户将信息输入系统,并将此信息存储到名为“ appts”的数据库中:

JS函数:

var config = {
apiKey: "____________",
authDomain: "southern-motors.firebaseapp.com",
databaseURL: "https://southern-motors.firebaseio.com",
projectId: "southern-motors",
storageBucket: "southern-motors.appspot.com",
messagingSenderId: "852338882104"
};
firebase.initializeApp(config);

var messagesRef = firebase.database().ref('appts');

document.getElementById('appts').addEventListener('submit', addAppt);
function addAppt(e) {
  e.preventDefault();
var inputName = document.getElementById("customerName").value;
var inputEmail = 
document.getElementById("customerEmail").value.toLowerCase();
var inputPhone = document.getElementById("customerPhone").value;
var inputDate = document.getElementById("customerDate").value;

messagesRef.push({
                name: inputName,
                email: inputEmail,
                phone: inputPhone,
                date: inputDate
            }).then(function() {
console.log("Document successfully written!");
location.reload();
})
.catch(function(error) {
console.error("Error writing document: ", error);
});

}

输入表单:

<div class="contact-form">
         <form id="appts" 
action="https://formspree.io/MYEMAIL" method="POST">
        <label>Name: </label><input id="customerName" class ="form-control" 
type="text" name="Name of Customer" required></input>

        </br>
        <label>Email Address: </label><input id="customerEmail" class="form- 
control" type="email" name="Email Address" required></input>
        </br>

        <label>Phone no.: </label><input id="customerPhone" class ="form- 
control" type="number" name="Phone No." required></input>
        </br>
        <label>Date & Time of Test Drive: </label><input id="customerDate" 
class ="form-control" type="datetime-local" name="Date & Time of Test Drive" 
required></input>
        </br>

        <input type="submit" value="Submit">
    </form>
</div>

类似的“注册用户”功能以不同的形式工作,所以我不确定为什么它不起作用。欢迎所有建议。

1 个答案:

答案 0 :(得分:1)

我测试了您的代码,它按提供的方式工作。这意味着问题出在权限上。

按提交后检查控制台,您很可能会看到此错误:

Error writing document:  Error: PERMISSION_DENIED: Permission denied
    at firebase.js:1
    at Dr (firebase.js:1)
    at t.callOnCompleteCallback (firebase.js:1)
    at firebase.js:1
    at firebase.js:1
    at e.onDataMessage_ (firebase.js:1)
    at t.onDataMessage_ (firebase.js:1)
    at t.onPrimaryMessageReceived_ (firebase.js:1)
    at t.onMessage (firebase.js:1)
    at t.appendFrame_ (firebase.js:1)
(anonymous) @ test.html:65
Promise.catch (async)
addAppt @ test.html:64

此错误表示您无权访问。访问Firebase's security page,以了解有关安全规则的更多信息。

如果要向所有人打开数据库,请使用以下规则:

{
  "rules": {
    ".read": true,
    ".write": true
  }
}