我有一個 JS 檔案物件，我需要將其轉換為 base64 值并在 JSON 物件中回傳該值。我正在使用 FileReader.readAsDataURL() 但由于它是異步的，所以我似乎沒有“按時”獲得 base64 值。我正在呼叫需要 obj 的回呼函式。資料值，但未定義。
function mapFileData(file, callback) {
var obj = {};
obj.name = file.filename;
obj.size = file.fileSize;
obj.type = file.fileType;
obj.data = getBase64(file);
});
console.log(JSON.stringify(obj)); // file object with undefined 'data' value
callback(obj);
}
function getBase64(file) {
var fileReader = new FileReader();
if (file) {
fileReader.readAsDataURL(file);
}
fileReader.onload = function(event) {
return event.target.result;
};
}
我真的不知道如何obj.data在呼叫時提供價值 callback(obj)。有什么幫助嗎？
uj5u.com熱心網友回復：
您需要將回呼語法轉換為async/await語法，以便await將要轉換的檔案轉換為 base64。
例如。
async function mapFileData(file, callback) {
var obj = {};
const base64 = await getBase64(file);
obj.name = file.filename;
obj.size = file.fileSize;
obj.type = file.fileType;
obj.data = base64
});
console.log(JSON.stringify(obj));
callback(obj); // it would be better to return the obj here and `await` this function in the caller, instead of using callback syntax
}
function getBase64(file) {
var fileReader = new FileReader();
if (file) {
fileReader.readAsDataURL(file);
}
return new Promise((resolve, reject) => {
fileReader.onload = function(event) {
resolve(event.target.result);
};
})
}
另外，我建議從mapFileData函式中洗掉回呼語法并將其async/await也轉換為語法。
更新
這是帶有Callback語法的解決方案。
function mapFileData(file, callback) {
const base64Callback = function(res) {
var obj = {};
obj.name = file.filename;
obj.size = file.fileSize;
obj.type = file.fileType;
obj.data = res
console.log(JSON.stringify(obj));
callback(obj);
}
getBase64(file, base64Callback)
}
function getBase64(file, callback) {
var fileReader = new FileReader();
if (file) {
fileReader.readAsDataURL(file);
}
fileReader.onload = function(event) {
callback(event.target.result);
};
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/533686.html
上一篇：AsyncAwait無法使用ReactNative從Firebase讀取資料
下一篇：異步回應是否立即存盤或處理？