繁体   English   中英

数据没有被推送到 Firebase(不一致的行为)

[英]Data not getting pushed to firebase (inconsistent behaviour)

我正在尝试在 firebase 数据库中推送可疑记录,一切正常,但推送部分似乎不起作用。 它很少起作用,不是每次都起作用。 这是函数:

async function storeSuspectData() {
var name = document.getElementById("name").value;
var height = document.getElementById("height").value;
var weight = document.getElementById("weight").value;
var idnumber = document.getElementById("idnumber").value;
var dob = document.getElementById("dob").value;
var crime = document.getElementById("crime").value;
var hypo = document.getElementById("hypo").value;
var gender;

if (document.getElementById("male").checked) {
    gender = 'male';
}
else if (document.getElementById("female").checked) {
    gender = 'female';
}
console.log(sessionStorage.getItem("userKey") + ' ' + name + ' ' + height + ' ' + weight + ' ' + idnumber + ' ' + dob + ' ' + gender + ' ' + crime + ' ' + hypo);

console.log('/users/' + sessionStorage.getItem("userKey") + '/suspectList/');

let token = await database.ref('/users/' + sessionStorage.getItem("userKey") + '/suspectList/');

await token.push().set({
    name: name,
    height: height,
    weight: weight,
    idnumber: idnumber,
    dob: dob,
    gender: gender,
    crime: crime,
    hypo: hypo,
});

alert('Record added successfully');
}

最后一条警报语句没有被执行,数据也没有被推送

这是数据库

在此处输入图片说明

我也在控制台上收到此错误,但我没有在任何地方使用 document.write()

BrowserPollConnection.ts:480 [Violation] Avoid using document.write().

当我单击调用该函数的按钮时,页面正在刷新,因为该按钮是表单中的提交按钮。 我明白了

Navigated to file:///D:/MyPrograms/CredibilityAnalyzer/front-end/pages/selectSuspect.html?name=afs&crime=0&height=1&weight=1&idnumber=1&dob=2021-01-01&hypo=asdf&gender=none

这是 HTML 代码:

<!DOCTYPE html>
<html>

<head>
    <title>Credibility Analyzer</title>
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css"
        integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
        integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="../style/selectSuspect.css">


    <script src="https://www.gstatic.com/firebasejs/8.7.1/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.7.1/firebase-database.js"></script>
    <script src="https://www.gstatic.com/firebasejs/8.7.1/firebase-analytics.js"></script>
    <script src="../script/form2.js"></script>

</head>

<body onload="fillSuspectList()">
    <div class="testbox">
        <form>
            <div class="banner">
                <h1>Credibility Analyzer</h1>
            </div>
            <div class="btn-block">
                <button type="submit" onclick="showInputForm()">Enter new suspect record</button>
                <button type="submit" onclick="showSelectSuspect()">Select suspect</button>
            </div>
            <div class="showInputForm" id="showInputForm" style="display: none;">
                <p>Suspect Information</p>
                <div class="item">
                    <label for="name">Name<span>*</span></label>
                    <input id="name" type="text" name="name" required />
                </div>
                <div class="btn-block">
                    <button type="submit" onclick="storeSuspectData()">SUBMIT</button>
                </div>
            </div>
    
        </form>
    </div>
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
        crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
        crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
        crossorigin="anonymous"></script>
</body>

</html>

它很少起作用,不是每次都起作用。

这通常表示竞争条件。 在这种情况下,我怀疑您的storeSuspectData在用户提交表单时被调用。 如果是这种情况:表单的默认行为是将数据发送到服务器,然后重定向到不同的页面。 因此,除非您的处理程序函数取消此默认行为,否则页面将被重定向,这可能/将中断对数据库的写入。

对此的解决方案是通过在触发它的事件上调用e.preventDefault()并从处理程序返回false取消表单的默认行为

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM