File Handling API

This feature is not (yet) supported on your device

The File Handling API enables web apps to register their ability to handle files types with the operating system. This enables the file manager of the OS or other operating system flows to use the web app to open the file, just like with a native app.

This feature is desktop only.

Open the file manager of the OS of your device and select one or multiple files of type .png, .jpg, .jpeg or .webm by right-clicking it and then select this PWA to open it (make sure it's installed as a PWA first).

The opened image(s) will then be displayed below.

// manifest.json "file_handlers": [ { "action": "/file-handling", "accept": { "image/pgn": [".png"], "image/jpeg": [".jpg", ".jpeg"] }, "icons": [ ], "launch_type": "single-client" } ] // javascript const selectedImages = document.querySelector('#selected-images'); launchQueue.setConsumer(async (launchParams) => { if(launchParams.files.length) { const fragment = document.createDocumentFragment(); for(const fileHandle of launchParams.files) { const file = await fileHandle.getFile(); const url = URL.createObjectURL(file); const div = document.createElement('div'); const img = document.createElement('img'); img.src = url; div.appendChild(img); fragment.appendChild(div); } selectedImages.appendChild(fragment); } });

Documentation

File Handling API on Chrome developers.

Browser support

The File Handling API is supported on Chrome 102+ and Edge 102+.