Bir dize içinde base64 ile kodlanmış ikili veri var.

var contentType = 'image/png';
var b64Data = 'iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==';

blob: bu verileri içeren bir URL oluşturmak istiyorum ve kullanıcıya görüntüler.

var blob = new Blob(????, {type: contentType});
var blobUrl = URL.createObjectURL(blob);

window.location = blobUrl;

Blob oluşturmak için nasıl anlamaya mümkün olmamıştır.

Bazı durumlarda yerine data: bir URL kullanarak bunu önlemek için mümkün duyuyorum.

var dataUrl = 'data:'   contentType   ','   b64Data;

window.location = dataUrl;

Ancak çoğu durumda data: URL engelleyici büyük.

Nasıl JavaScript Blob bir nesneye base64 dize çözebilir miyim?

atob işlevi ikili veri her byte için bir karakter ile yeni bir dize içine base64 kodlanmış bir dize olarak çözecektir.

var byteCharacters = atob(b64Data);

Her karakterin kod noktası (İngilizce klavyede) bayt değeri olacak. Bu dize her karakter için .charCodeAt yöntemi uygulayarak bayt değerleri dizisi oluşturabiliriz.

var byteNumbers = new Array(byteCharacters.length);
for (var i = 0; i < byteCharacters.length; i  ) {
    byteNumbers[i] = byteCharacters.charCodeAt(i);
}

Uint8Array kurucu geçirerek gerçek yazılan bayt dizisine bayt değerleri bu dizi dönüştürebilirsiniz.

var byteArray = new Uint8Array(byteNumbers);

Bu da bir dizi Blob kurucu geçirmeden onu sararak Blob bir dönüştürülebilir.

var blob = new Blob([byteArray], {type: contentType});

Yukarıdaki yaklaşım this fiddle orijinal örnek için bkz. Ancak performans daha küçük dilimler halinde byteCharacters yerine, tek seferde işleyerek biraz geliştirilebilir. Benim kaba test 512 bayt güzel dilim bir boyut gibi görünüyor. Bu bize aşağıdaki işlevi verir. this fiddle orijinal örnek kullanım görebilirsiniz.

function b64toBlob(b64Data, contentType, sliceSize) {
    contentType = contentType || '';
    sliceSize = sliceSize || 512;

    var byteCharacters = atob(b64Data);
    var byteArrays = [];

    for (var offset = 0; offset < byteCharacters.length; offset  = sliceSize) {
        var slice = byteCharacters.slice(offset, offset   sliceSize);

        var byteNumbers = new Array(slice.length);
        for (var i = 0; i < slice.length; i  ) {
            byteNumbers[i] = slice.charCodeAt(i);
        }

        var byteArray = new Uint8Array(byteNumbers);

        byteArrays.push(byteArray);
    }

    var blob = new Blob(byteArrays, {type: contentType});
    return blob;
}

var blob = b64toBlob(b64Data, contentType);
var blobUrl = URL.createObjectURL(blob);

window.location = blobUrl;