Làm thế nào để blob: giao thức hoạt động như nguồn <video>?

Question

Một người bạn của tôi đã cố gắng để tải về một đoạn video Twitter nhúng và tìm thấy một cái gì đó như thế này trong mã HTML:

<video preload="auto" data-id="content" data-type="content" src="blob:https%3A//twitter.com/7897de6d-6eed-4905-9ed2-00ea3d2c99d5" class="visible paused" style="width: 100%; height: 100%;"></video> 

Tôi như bối rối khi ông là khi tôi đã cố gắng để tìm ra thực nguồn của luồng video (bằng cách kiểm tra bảng điều khiển mạng của trình duyệt và nhấn vào proxy). Khi video được phát, các byte dường như không xuất hiện ở đâu cả.

Trình duyệt hiểu được "giao thức" của blob như thế nào?

Answer 1

Blobs là cách xử lý bộ nhớ thuộc về trình duyệt. Đây có thể là tệp hoặc dữ liệu từ canvas hoặc dữ liệu được tính theo cách khác. Khi dữ liệu được tải theo cách mà JavaScript có quyền truy cập blob vào đó, bạn có thể tạo BlobURI, là url trỏ đến cấu trúc bộ nhớ trong.

Trong trường hợp twitter sử dụng URL của blob cho video, tôi nghi ngờ rằng họ đang ủy quyền video thông qua canvas để áp dụng bộ lọc hoặc đang sử dụng blobs cho một số loại bộ đệm cục bộ. Dù bằng cách nào, điều này có nghĩa là bộ nhớ có thể truy cập vào JS tại một số điểm trong quá khứ.