javascript - Node.js回调，等待函数结束

Question

我正在尝试发送一个 ajax 请求，该请求从 ftp 服务器检索文件名列表。检索文件不是问题，但是当我传递 ajax 请求(单击 index.ejs 文件中的按钮)时，它会在完成获取所有文件之前渲染 View (res.render 中的 files 变量为空)。我尝试过使用异步并行，但执行要么卡在 searchFiles 函数中，要么在函数执行之前渲染 View 。有什么想法吗 ？ (我想我的回调方式是错误的，我只是不知道如何做)。

在我的 server.js 文件中:

var Files = require('./prototypes/files.js');
var files, searchedFiles;

app.get('/search', function (req, res) {
    files = new Files();
    files.searchFiles(req.query.t, function(searchedFiles) {
        console.log(searchedFiles);
        res.render('index', {files: searchedFiles});
    });
});

在我的 files.js 文件中:

function Files() {
}

Files.prototype.searchFiles = function(searchedText, callback) {
    var connectionProperties = {
        host: "host",
        user: "username",
        password: "password"
    }
    var folders = ["", "0-9", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X-Z"];
    var Client = require('ftp'); 
    var c = new Client();
    var files = {};    
    c.on('ready', function () {
        folders.forEach(function(folder) {
            c.list("/pools/A/A0/Movies/Films/" + folder, function (err, list) {
                if (err) throw err;
                list.forEach(function (element, index, array) {
                    if (element.name.match("(mkv|avi|mp4|mov)$") && (element.name.toLowerCase().indexOf(searchedText.toLowerCase()) > -1)) {
                        console.log(element.name);
                        files[element.name] = element.size;
                    }
                });
            });
        });
    });
    c.connect(connectionProperties);
    callback(files);
}

module.exports = Files

在我的 index.ejs 文件中，我有这个 block 和脚本:

<div id="container">
    <% if (typeof files !== 'undefined' && files ) { for (file in files) { %>
        <p><%= file + " ----- " + files[file] %></p>
    <% }} %>
</div>
<button onclick="getFiles(); return false; %>">LOL</button>
<script>
    function getFiles() {
        searchedText = 'wild'; // wild is used as an example here
        if (searchedText != "") {
            $.ajax({
                type: 'GET',
                cache: false,
                url: "http://localhost:8080/search?t=" + searchedText,
                success: function(data) {
                    $('#container').html(data);
                }
            });
        }
    }
</script>

Answer 1

我找到了如何使用异步来解决这个问题，谢谢@RayonDabre

在使用异步执行回调函数之前，我必须检查循环是否全部完成(JavaScript 中的 foreach 循环是阻塞的，因此必须使用异步)。

代码现在是:

var i = 0;
c.on('ready', function () {
    folders.forEach(function(folder) {
        c.list("/pools/A/A0/Movies/Films/" + folder, function (err, list) {
            if (err) throw err;
                var j = 0;
                async.forEach(list, function (element, index, array) {
                if (element.name.match("(mkv|avi|mp4|mov)$") && (element.name.toLowerCase().indexOf(searchedText.toLowerCase()) > -1)) {
                    files[element.name] = element.size;
                }
                if ((i == folders.length - 1) && (j == list.length - 1)) {
                    callback(files);
                }
                j++;
            });
            i++;
        });
    });
});`