Blob.type

The type property of a Blob object returns the MIME type of the file.

Value

A DOMString containing the file's MIME type, or an empty string if the type could not be determined.

Examples

This example asks the user to select a number of files, then checks each file to make sure it's one of a given set of image file types.

HTML

<input type="file" id="input" multiple>
<output id="output">Choose image files...</output>

JavaScript

// our application only allows GIF, PNG, and JPEG images
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 = 'Choose image files...';
    return;
  }

  if (Array.from(files).every((file) => allowedFileTypes.includes(file.type))) {
    output.innerText = 'All files clear!';
  } else {
    output.innerText = 'Please choose image files only.';
  }
});

Result

Specifications

Specification
File API
# dfn-type

Browser compatibility

BCD tables only load in the browser

See also