Đừng tạo blob, hãy tự tạo

Eric Bidelman

Xin thông báo với tất cả những người hâm mộ BlobBuilder sắp đến ngày tạm biệt!

BlobBuilder là một API tiện dụng để tạo Blob (hoặc Tệp) trong JavaScript. Đã xuất hiện kể từ Chrome 8, FF 6 và IE 10 nhưng chưa bao giờ được đưa vào Safari và có thể sẽ không bao giờ. Các thay đổi gần đây về thông số kỹ thuật đối với File API bao gồm một hàm khởi tạo mới cho Blob, điều này về cơ bản khiến BlobBuilder không liên quan. Trên thực tế, các đêm tối trên Safari đã tắt tính năng này và Chrome sẽ sớm bắt đầu cảnh báo cho bạn trong bảng điều khiển.

Để so sánh, dưới đây là cùng một mã sử dụng BlobBuilder không dùng nữa và hàm khởi tạo Blob mới. Đoạn mã sẽ tạo một biểu định kiểu và thêm biểu định kiểu đó vào DOM.

BlobBuilder():

window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder ||
                        window.MozBlobBuilder || window.MSBlobBuilder;
window.URL = window.URL || window.webkitURL;

var bb = new BlobBuilder();
bb.append('body { color: red; }');
var blob = bb.getBlob('text/css');

var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = window.URL.createObjectURL(blob);

document.body.appendChild(link);

Blob():

window.URL = window.URL || window.webkitURL;

var blob = new Blob(['body { color: red; }'], {type: 'text/css'});

var link = document.createElement('link');
link.rel = 'stylesheet';
link.href = window.URL.createObjectURL(blob);
document.body.appendChild(link);

Tiện lợi! Vì vậy, giờ đây, thay vì thêm BlobBuilder, chúng ta chỉ cần tạo Blob từ một mảng các phần dữ liệu. Các phần dữ liệu có thể thuộc nhiều loại (DOMString, ArrayBuffer, Blob) và theo thứ tự bất kỳ. Ví dụ:

var blob = new Blob(['1234567890', blob, arrayBuffer]);

Ngoài ra, xin lưu ý rằng tham số đối tượng thứ hai là không bắt buộc. Để biết thêm thông tin về những thay đổi này, hãy xem tài liệu về MN trên Blob.