StorageManager.getDirectory()

Baseline 2023
Newly available

Since March 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

StorageManager インターフェイスの getDirectory() メソッドは、オリジンプライベートファイルシステム (OPFS) に保存されたディレクトリーとその中身へのアクセスを可能にする FileSystemDirectoryHandle オブジェクトへの参照を取得するために使用されます。

構文

js
getDirectory()

引数

なし

返値

FileSystemDirectoryHandle のオブジェクトで解決される Promise を返します。

例外

SecurityError DOMException

ユーザーエージェントが要求されたディレクトリーをローカルの OPFS にマップできないとき投げられます。

以下の非同期イベントハンドラー関数は、ウェブワーカーの中にあります。メインスレッドからメッセージを受信すると、以下の動作をします。

  1. getDirectory() を用いて OPFS のルートを表す FileSystemDirectoryHandle を取得し、変数 root に保存します。
  2. FileSystemDirectoryHandle.getFileHandle() を用いてファイルハンドルを取得します。
  3. FileSystemFileHandle.createSyncAccessHandle() を用いて同期式ファイルアクセスハンドルを作成します。
  4. ファイルのサイズを取得し、格納するための ArrayBuffer を作成します。
  5. ファイルの読み書きをします。
  6. 変更をディスクに保存し、同期式アクセスハンドルを閉じます。
js
onmessage = async (e) => {
  // メインスクリプトから送られた、処理対象のメッセージを取得する
  const message = e.data;

  // ファイル draft のハンドルを取得する
  const root = await navigator.storage.getDirectory();
  const draftHandle = await root.getFileHandle("draft.txt", { create: true });
  // 同期式アクセスハンドルを取得する
  const accessHandle = await draftHandle.createSyncAccessHandle();

  // ファイルのサイズを取得する
  const fileSize = accessHandle.getSize();
  // ファイルの内容をバッファーに読み込む
  const buffer = new DataView(new ArrayBuffer(fileSize));
  const readBuffer = accessHandle.read(buffer, { at: 0 });

  // メッセージをファイルの最後に書き込む
  const encoder = new TextEncoder();
  const encodedMessage = encoder.encode(message);
  const writeBuffer = accessHandle.write(encodedMessage, { at: readBuffer });

  // 変更をディスクに保存する
  accessHandle.flush();

  // 完了したら、常に FileSystemSyncAccessHandle を閉じる
  accessHandle.close();
};

メモ: 仕様の以前のバージョンでは、close()flush()getSize()truncate() は誤って非同期メソッドとされていました。これは現在では変更されていますが、まだ非同期バージョンをサポートしているブラウザーもあります。

仕様書

Specification
File System
# dom-storagemanager-getdirectory

ブラウザーの互換性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
getDirectory

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support

関連情報