调整 onload 函数以与 async/await 一起使用答案

【问题标题】：adjust onload function to be used with async/await调整 onload 函数以与 async/await 一起使用
【发布时间】：2022-11-23 08:59:48
【问题描述】：

我正在努力将从 URL 获取的 xlsx 转换为浏览器中的 JSON 对象。

这个答案有效 --> https://stackoverflow.com/a/52237535/5079799

但是，我无法获取等待响应的代码。所有在线答案似乎都是关于图像和/或使用输入文件阅读器的，但我正在获取一个 URL。

我如何将这一切包装在一个函数中：

从 URL 获取 XLSX
转换为 JSON
返回 JSON

到目前为止，这是我一直在搞的事情，但它总是以未设置外部变量结束，但内部变量正常工作。

async function Outside_Test(){
    var reso = await Get_JSON()
    console.log('reso_out')
    console.log(reso)
}

async function Get_JSON() {
    var url = "http://myspreadsheet.xlsx"
    var oReq = new XMLHttpRequest();
    oReq.open("GET", url, true);
    oReq.responseType = "arraybuffer";

    //oReq.onload = 

    return oReq.send() 
        .then(function (oReq) {
            var arraybuffer = oReq.response;

            /* convert data to binary string */
            var data = new Uint8Array(arraybuffer);
            var arr = new Array();
            for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
            var bstr = arr.join("");

            /* Call XLSX */
            var workbook = XLSX.read(bstr, {
                type: "binary"
            });

            /* DO SOMETHING WITH workbook HERE */
            var first_sheet_name = workbook.SheetNames[0];
            /* Get worksheet */
            var worksheet = workbook.Sheets[first_sheet_name];
            var reso = (XLSX.utils.sheet_to_json(worksheet, {
                raw: true
            }));
            console.log('inside-reso')
            return reso
        })

}

【问题讨论】：

你在 oReq.onload = 中尝试了什么 - 顺便说一句，XMLHttpRequest.send 不返回承诺，所以不确定你为什么使用 .then

标签： javascript

【解决方案1】：

您需要从 Get_JSON 返回一个 Promise，该 Promise 在调用 .onload 时解析

就像是

function Get_JSON() {
    return new Promise((resolve, reject) => {
        var url = "http://myspreadsheet.xlsx"
        var oReq = new XMLHttpRequest();
        oReq.open("GET", url, true);
        oReq.responseType = "arraybuffer";
        oReq.onload = function () {
            /* convert data to binary string */
            /* Call XLSX */
            /* DO SOMETHING WITH workbook HERE */
            /* Get worksheet */
            console.log('inside-reso')
            resolve(reso);
        });
        oReq.onerror = reject;
        oReq.send() ;
    });
}

注意：不需要 Get_JSON 为 async ... 因为你永远不需要 await

【讨论】：