data：Blob的URL - 問題與鉻

我一直拉着我的頭髮了幾個小時，現在已經問了幾次這裏的問題：我有一個閃存錄音機的二進制數據，我轉進入一個dataURL，然後想要轉換爲一個blob上傳。 SO給了我幾個答案，其本質上都是一樣的：data：Blob的URL - 問題與鉻

我寫了一個基於上述

var data = window.atob(dataURL.split(',')[1]); 
var length = data.length; 
var uInt8Array = new Uint8Array(length); 
for (var i = 0; i < length; ++i) { 
    uInt8Array[i] = data.charCodeAt(i); 
} 
var myfile = new Blob([uInt8Array], {'type': 'audio/x-wav'});

下面的代碼

這在杉木中完美運作efox nightly（20）和chrome 25，但是鉻20一直告訴我myfile的大小是19字節（當它應該是幾kb），並且隨後的上載失敗一致。這是一個鉻中的錯誤，還是我錯過了一個文件說它不支持？任何替代的想法？

來源

2012-12-12 Laurent S

雖然[這個答案]（http://stackoverflow.com/a/11954337/1558890）說'BlobBuilder' API已被棄用，你試過了，如果使用它在Chromium上工作？該答案中的示例代碼填充了非類型數組，然後將其轉換爲類型數組。我看不出爲什麼會這麼重要，但是你試過這個嗎？一個jsfiddle可能是有用的... ... –

好吧，它看起來像「BlobBuilder/webkitBlobBuilder」甚至不存在鉻，所以我甚至不能回退它... –

哦，是的，我確實嘗試過無類型數組第一，沒有運氣。 –

它看起來像鉻的Blob()構造函數中有一個錯誤時調用某些參數。我縮小了問題on jsfiddle（鉻運行看問題，其他瀏覽器似乎處理得當，這兩種斑點的大小應該是32）

這是我放在一起，避開它的代碼：

var data = window.atob(dataURL.split(',')[1]); 
var length = data.length; 
var buffer = new ArrayBuffer(length); // added this line 
var uInt8Array = new Uint8Array(buffer); 
for (var i = 0; i < length; ++i) { 
    uInt8Array[i] = data.charCodeAt(i); 
} 
// two options here: 
// buggy: produces a 19byte long file in chromium 
var myfile = new Blob([uInt8Array], {'type': 'audio/x-wav'}); 
// works in chromium (and firefox), but produces a deprecation warning in chrome 
var myfile = new Blob([buffer], {'type': 'audio/x-wav'});

最後我跑第一選擇，然後if (myfile.size == 19) {拿到第二個如果需要

來源

2012-12-13 13:29:06

請參閱https://code.google.com/p/chromium/issues/detail?id=165907瞭解鉻問題。 –

另外，上面的代碼永遠不會填充'buffer'。使用第二種方法時，你是否在循環中執行此操作？ –

'Uint8Array'是緩衝區的視圖，所以填充它也會填充'ArrayBuffer'。詳情請參閱https://developer.mozilla.org/en-US/docs/JavaScript_typed_arrays#Buffers_and_views.3A_typed_array_architecture –

使用我的代碼轉換dataURI成團塊。

function dataURLtoBlob(dataURL) { 
    var arr = dataURL.split(','), mime = arr[0].match(/:(.*?);/)[1], 
     bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n); 
    while(n--){ 
     u8arr[n] = bstr.charCodeAt(n); 
    } 
    return new Blob([u8arr], {type:mime}); 
}

來源

2015-05-23 01:46:17 cuixiping

data：Blob的URL - 問題與鉻

回答

相關問題