在canvas.ToBlob（）異步函數之外訪問blob值

我正在與HTMLCanvas元素一起返回async toBlob()函數之外的blob對象。該函數不返回輸出值，所以我試圖在外部聲明一個變量並通過命令訪問它。在canvas.ToBlob（）異步函數之外訪問blob值

如何在此場景中使用JS Promise？

var myblob; 
 
      canvas.toBlob(function(blob) {       
 
           myblob = blob; 
 
           console.log("inside " + myblob); // getting value after the console outside 
 
          }) 
 
console.log("outside " + myblob); // getting undefined

來源

2017-02-25 Sowmyan Soman

傳遞Blob實例resolve()，訪問Promise值內'.toBlob執行任務（）'回調或使用'Promise'構造函數 – guest271314

可能的重複[爲什麼我的變量在我修改後沒有改變o函數？ - 異步代碼引用]（http://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron） – Andreas

您可以使用Promise構造，在.then()

function getCanvasBlob(canvas) { 
    return new Promise(function(resolve, reject) { 
    canvas.toBlob(function(blob) { 
     resolve(blob) 
    }) 
    }) 
} 

var canvasBlob = getCanvasBlob(canvas); 

canvasBlob.then(function(blob) { 
    // do stuff with blob 
}, function(err) { 
    console.log(err) 
});

來源

2017-02-25 17:05:00 guest271314

謝謝你很多，並apreciate您的及時迴應。我的問題是，我必須在全局變量中設置blob的值，以便我可以在此函數之外訪問它。例如：canvasBlob.then（function（blob））{this.something = blob; } –

在.toBlob（）回調函數返回值之前，您將無法訪問Blob。使用傳遞給'.then（）'的第一個函數從'.toBlob（）'回調函數中用'Blob'執行任務。 – guest271314

謝謝。在我的場景中，我有一個視頻元素和畫布來捕獲視頻中的快照並將其呈現在圖像控件中。目前代碼在捕獲鼠標點擊事件中執行。現在，一旦我有了圖片，我必須讓用戶點擊一個按鈕，通過ajax請求將圖片發送到服務器。目前toBlob（）正在捕獲事件中執行，我想查看是否有辦法獲取存儲的BLOB，以便我可以在按鈕單擊事件中訪問它以將其提交給服務器。任何建議將是非常有益的！ –

在canvas.ToBlob（）異步函數之外訪問blob值

回答

相關問題