时间戳

首页 > 解决方案 > 从 Javascript 函数中提取 dataURL

javascript - 从 Javascript 函数中提取 dataURL

问题描述

我有一个旨在使用 FileReader 创建文件的 dataURL 的函数。考虑这个例子。

toDataURL(url, callback){
  var xhr = new XMLHttpRequest();
  xhr.open('get', url);
  xhr.responseType = 'blob';
  xhr.onload = function(){
    var fr = new FileReader();
    var test = fr.onload = function(){
      callback(this.result);
    };

    fr.readAsDataURL(xhr.response); // async call
  };

  xhr.send();
}

我想将this.result内联函数中的变量提取为返回变量。它没有其他功能的访问权限。我该怎么做？

标签： javascript

解决方案

基本上，您要做的是从异步函数返回一个值，您可以使用 Promises 和可选的 async/await 来执行此操作。

看一下这个：

function toDataURL(url, callback) {
  return new Promise( function(resolve, reject) {
    
    var xhr = new XMLHttpRequest();
    xhr.open('get', url);
    xhr.responseType = 'blob';
    xhr.onload = function() {
      var fr = new FileReader();
      var test = fr.onload = function() {
        resolve(this.result)
        callback(this.result);
      };

      fr.readAsDataURL(xhr.response); // async call
    };
    
    xhr.onerror = function() {
      reject('Error);
    }

    xhr.send();
  });
}

const result = await toDataURL('some url');

// or

toDataURL('some url').then((result) => {
  // do something with the result
});

推荐阅读