/Web APIs

StorageManager: getDirectory() method

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The getDirectory() method of the StorageManager interface is used to obtain a reference to a FileSystemDirectoryHandle object allowing access to a directory and its contents, stored in the origin private file system (OPFS).





Return value

A Promise that fulfills with a FileSystemDirectoryHandle object.


SecurityError DOMException

Thrown if the user agent is not able to map the requested directory to the local OPFS.


The following asynchronous event handler function is contained inside a Web Worker. On receiving a message from the main thread it:

  1. Gets a FileSystemDirectoryHandle representing the root of the OPFS using getDirectory(), storing it in the root variable.
  2. Gets a file handle using FileSystemDirectoryHandle.getFileHandle().
  3. Creates a synchronous file access handle using FileSystemFileHandle.createSyncAccessHandle().
  4. Gets the size of the file and creates an ArrayBuffer to contain it.
  5. Reads and writes to the file.
  6. Persists the changes to disk and closes the synchronous access handle.
onmessage = async (e) => {
  // Retrieve message sent to work from main script
  const message = e.data;

  // Get handle to draft file
  const root = await navigator.storage.getDirectory();
  const draftHandle = await root.getFileHandle("draft.txt", { create: true });
  // Get sync access handle
  const accessHandle = await draftHandle.createSyncAccessHandle();

  // Get size of the file.
  const fileSize = accessHandle.getSize();
  // Read file content to a buffer.
  const buffer = new DataView(new ArrayBuffer(fileSize));
  const readBuffer = accessHandle.read(buffer, { at: 0 });

  // Write the message to the end of the file.
  const encoder = new TextEncoder();
  const encodedMessage = encoder.encode(message);
  const writeBuffer = accessHandle.write(encodedMessage, { at: readBuffer });

  // Persist changes to disk.

  // Always close FileSystemSyncAccessHandle if done.

Note: In earlier versions of the spec, close(), flush(), getSize(), and truncate() were wrongly specified as asynchronous methods. This has now been amended, but some browsers still support the asynchronous versions.


Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
getDirectory 86 86 111 No 72 15.2 109 109 111 74 15.2 No

See also

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.