javascript - 将值从 Firebase JS 回调方法 (DAL) 返回到另一个函数( Controller )

Question

我一直在开发一个简单的聊天应用程序，该应用程序允许用户在简单的群聊中键入消息并实时更新/显示它们。因此，我决定使用 Firebase，并花了一些时间来习惯它的 Web API。但是，当我尝试手动创建简单的用户身份验证系统，甚至只是将值列表返回到另一个函数时，我遇到了一些问题。

我试图遵循 MVC 模式，使用 HTML 表单触发 global.js 内的事件处理程序，然后调用 Controller 文件中的适当方法， Controller 文件又调用达尔。 DAL 转到远程 Firebase 并执行请求的操作。

我的问题是，在 once 事件处理程序触发后我没有发生任何事情。 Controller 将执行 checkUserLogin() 方法，但不会将任何内容分配给变量 loginValid。据我从调试中得知，执行到达事件处理程序的末尾，然后自行丢弃。我读过一些有关异步 JS 的内容，但不太理解。

我想要发生的就是从 Firebase 检索列表，在将结果从 DAL 传递到 Controller 之前对其进行处理以进行身份​​验证，然后在 Controller 中对结果进行处理。出于这些目的，我并不关心实时更新，我只是有时想返回 Firebase 列表中数据的当前快照，并在另一个函数中对其执行操作。

这是我的文件结构(根据需要)。 global.js 包含事件处理程序，负责处理 HTML 页面事件并选择适当的 Controller 操作 (security_controller.js)，然后调用必要的 DAL 操作 ( >security_dal.js)。

global.js

$(document).ready(function() {
    $("#btnSubmitLogin").on("click", btnSubmitLogin_click);
});

function btnSubmitLogin_click() {
     doUserLogin();
}

security_controller.js

function doUserLogin() {
    var username = $("#txtLoginUsername").val();
    var password = $("#txtLoginPassword").val();

    //Determine if user is logged in, and react accordingly
    var loginValid = checkUserLogin(username, password);

    if (loginValid) {
        navigateToPage("pageHome");
        $("#successMessageLogin").text("Success validating user");
    }
    else {
        navigateToPage("pageLogin");
        $("#errorMessageLogin").text("Error validating user");
    }
}

security_dal.js

function checkUserLogin(username, password) {
    var foundUser = null;
    var loginValid = false;

    fb_ref.once("value", function(snapshot) {
        var list = snapshot.val();

        for (var i in list) {
            if (list[i].username === username && list[i].password === password) {
                foundUser = list[i];
                break;
            }
        }           

        return loginValid;
    });

    if (foundUser !== null) {
        console.info(foundUser.username);
        console.info(foundUser.password);
        loginValid = true;
    }

    return loginValid;
}

我检查了几个类似的搜索，但没有找到任何可以回答我的问题的结果。在下面的问题/答案中，答案提到了有关异步 javascript 的一些内容，并且似乎只需将检索值后需要执行的代码放在回调函数中即可解决该问题。然而，这违背了我试图通过“MVC 模式”实现的目标。 DAL 不应接触 View ，而应将返回值传递回 Controller 。

Firebase Query Inside Function Returns Null

理想情况下，这就是我想要发生的事情:

• global.js 调用 btnSubmitLogin_click()
• btnSubmitLogin_click() 在 Controller 中调用 doUserLogin
• Controller 中的doUserLogin调用DAL中的checkUserLogin
DAL 中的
• checkUserLogin 从 Firebase 检索用户列表，并查找与输入的凭据相匹配的内容
DAL 中的
• checkUserLogin 返回 true/false 给 Controller ，并将其分配给变量 loginValid
• Controller 决定如何处理此信息，并根据需要更新 View

注意:我完全知道 Firebase 有自己的身份验证，但我想创建自己的简单版本，只是为了获得我猜的体验。因此，我只需要一个数据列表/数组即可在 Controller 中进行操作。我也知道过滤/排序的可能性，但是我希望使用此方法来检查用户，因为我想知道如何检索列表。

如果我的做法完全错误(Firebase 新手)，或者是否应该提供其他内容，请告诉我。谢谢!

Answer 1

是的，异步性是这里的关键。一般来说，您可以通过自己的回调来解决这个问题。这样您仍然可以在正确的位置执行逻辑。

在这种情况下，您可以为 checkUserLogin 创建第三个参数:

checkUserLogin(username, password, function(foundUser) {

     if (foundUser) {
         navigateToPage("pageHome");
         $("#successMessageLogin").text("Success validating user");
     } else {
        navigateToPage("pageLogin");
        $("#errorMessageLogin").text("Error validating user");
     }
});

然后:

function checkUserLogin(username, password, callback) {
    fb_ref.once("value", function(snapshot) {
        var list = snapshot.val();
        var foundUser;

        for (var i in list) {
            if (list[i].username === username && list[i].password === password) {
                foundUser = list[i];
                break;
            }
        }           
        callback(foundUser)
    });
}

(有义务指出未加密的密码等)