JavaScript - 從二進制JPG數據創建圖像

Question

由於瀏覽器知道如何處理JPG文件，有沒有辦法讓它們動態地顯示JPG文件的實際二進制數據並允許它們解碼它？

我無法提供該文件作爲正常的image.src =「path.jpg」，因爲數據最初是在JS中解析的另一個文件的一部分。

此外，我有奇怪的JPG文件存儲阿爾法，所以像https://github.com/notmasteryet/jpgjs庫不能處理它們。

Answer 1

您可以使用Blob s從二進制數據創建對象，稍後您將該對象作爲圖像解碼的URL傳遞。假設你已經存儲類型數組的二進制數據，你可以做這樣的事情：

var blob = new Blob([myTypedArray], {type: 'application/octet-binary'}); 
var url = URL.createObjectURL(blob); 

現在，您可以通過該網址爲圖像的源：

var img = new Image; 
img.onload = function() { 
    URL.revokeObjectURL(url); 
    ... 
}; 
img.src = url; 

請注意，您仍然有保證您傳入的數據是瀏覽器可以處理的有效圖像格式。