Blob: thuộc tính type

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Note: This feature is available in Web Workers.

Thuộc tính chỉ đọc type của giao diện Blob trả về MIME type của tệp.

Note: Dựa trên cách triển khai hiện tại, trình duyệt thực tế sẽ không đọc luồng byte của tệp để xác định kiểu phương tiện. Kiểu được giả định dựa trên phần mở rộng của tệp; một tệp hình ảnh PNG bị đổi tên thành .txt sẽ cho ra "text/plain" chứ không phải "image/png". Hơn nữa, blob.type nhìn chung chỉ đáng tin cậy với các kiểu tệp phổ biến như hình ảnh, tài liệu HTML, âm thanh và video. Các phần mở rộng tệp không phổ biến sẽ trả về chuỗi rỗng. Cấu hình phía máy khách (chẳng hạn Windows Registry) có thể dẫn đến những giá trị ngoài dự kiến ngay cả với kiểu phổ biến. Nhà phát triển được khuyến nghị không nên dựa vào riêng thuộc tính này như một cơ chế xác thực duy nhất.

<input type="file" id="input" multiple />
<output id="output">Chọn tệp hình ảnh…</output>

output {
  display: block;
  margin-top: 16px;
}

JavaScript

// Ứng dụng của chúng ta chỉ cho phép ảnh GIF, PNG và JPEG
const allowedFileTypes = ["image/png", "image/jpeg", "image/gif"];

const input = document.getElementById("input");
const output = document.getElementById("output");

input.addEventListener("change", (event) => {
  const files = event.target.files;

  if (files.length === 0) {
    output.innerText = "Chọn tệp hình ảnh…";
    return;
  }

  const allAllowed = Array.from(files).every((file) =>
    allowedFileTypes.includes(file.type),
  );
  output.innerText = allAllowed
    ? "Tất cả tệp đều hợp lệ!"
    : "Vui lòng chỉ chọn tệp hình ảnh.";
});