JavaScript 返回 "Undefined"

Question

这个问题已经有答案了:

How do I return the response from an asynchronous call? (42 个回答)

已关闭 5 年前。

我正在尝试使用 input[type=file] 上传文件在表单提交(其中包含“名字”、“姓氏”等其他元素)时，我将文件转换为字符串并将其作为 JSON 传递到服务器。

HTML:

<input type="file" class="form-control" id="resume" accept=".doc, .docx, .pdf" />

脚本:

var resume = document.getElementById('resume').files[0];
var result = getbase64(resume);
console.log(result); 

这将返回undefined但是console.log当上面的行调用该方法时，实际方法内部会记录正确的内容。

function getBase64(file) {
    var reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = function () {
        var result = reader.result;
        console.log('here---->   '+result);
        return result;
    };
    reader.onerror = function (error) {
        console.log('Error: ', error);
    };
} 

我的问题是如何正确将此返回类型分配给变量，以便我可以将其作为字符串发送到服务器。

Answer 1

您的返回语句返回结果未返回您期望的内容，因为它位于事件监听器中。也就是说，函数 getBase64 的输出将为 Undefined。您只需传递一个回调函数即可在加载事件发生时传输文件。

function getBase64(file, transferMyFile) {
    var reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = function () {
        var result = reader.result;
        console.log('here---->   '+result);
        transferMyFile(result)
        /* Or just transfer it here */
    };
    reader.onerror = function (error) {
        console.log('Error: ', error);
    };
}