← 返回首页

FileSystemDirectoryHandle - Web API | MDN

Toggle sidebar

Theme

OS default
Light
Dark

日本語

Remember language Learn more

FileSystemDirectoryHandle

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2023年3月.

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

File System Access API の FileSystemDirectoryHandle インターフェイスは、ファイルシステムのディレクトリーへのハンドルを提供します。

このインターフェイスは、メソッド window.showDirectoryPicker()・StorageManager.getDirectory()・DataTransferItem.getAsFileSystemHandle()・FileSystemDirectoryHandle.getDirectoryHandle() からアクセス可能です。

FileSystemHandle FileSystemDirectoryHandle

In this article

インスタンスプロパティ

親の FileSystemHandle からプロパティを継承します。

インスタンスメソッド

親の FileSystemHandle からメソッドを継承します。

FileSystemDirectoryHandle.entries()

オブジェクト自身の列挙可能なプロパティの [key, value] ペアの新しい 非同期イテレーター を返します。

FileSystemDirectoryHandle.getFileHandle()

メソッドが呼ばれたディレクトリー内の指定の名前のファイルを表す FileSystemFileHandle で解決する Promise を返します。

FileSystemDirectoryHandle.getDirectoryHandle()

メソッドが呼ばれたディレクトリー内の指定の名前のサブディレクトリーを表す FileSystemDirectoryHandle で解決される Promise を返します。

FileSystemDirectoryHandle.keys()

FileSystemDirectoryHandle 内の各アイテムのキーを含む新しい 非同期イテレーター を返します。

FileSystemDirectoryHandle.removeEntry()

ディレクトリーハンドルに指定の名前のファイルまたはディレクトリーがある場合、非同期でエントリーを削除しようとします。

FileSystemDirectoryHandle.resolve()

親ハンドルから指定の子エントリーへのディレクトリー名の Array (最後の要素は指定した子エントリーの名前) で解決する Promise を返します。

FileSystemDirectoryHandle.values()

FileSystemDirectoryHandle 内の各インデックスに対応する値を含む新しい 非同期イテレーター を返します。

FileSystemDirectoryHandle[Symbol.asyncIterator]()

デフォルトでは entries 関数を返します。

例

以下の例では、指定の名前のディレクトリーハンドルを返します。指定したディレクトリーが存在しない場合は、作成されます。

js
const dirName = "directoryToGetName";

// ディレクトリーハンドル 'currentDirHandle' があると仮定
const subDir = currentDirHandle.getDirectoryHandle(dirName, { create: true });

以下の非同期関数は、resolve() を用いて、選択されたファイルの指定のディレクトリーハンドルを基準とする相対パスを取得します。

js
async function returnPathDirectories(directoryHandle) {
  // ファイルピッカーを開いてファイルハンドルを得る
  const handle = await self.showOpenFilePicker();
  if (!handle) {
    // ユーザーがキャンセルしたか、ファイルを開くのに失敗した
    return;
  }

  // ハンドルがディレクトリーハンドルが表すディレクトリー内にあるかを確認する
  const relativePaths = await directoryHandle.resolve(handle);

  if (relativePath === null) {
    // ディレクトリーハンドル内にない
  } else {
    // relativePath は相対パスを表す名前の配列

    for (const name of relativePaths) {
      // 各エントリーを記録する
      console.log(name);
    }
  }
}

以下の例では、ディレクトリーを再帰的に走査し、ディレクトリー内の各ファイルを表す FileSystemFileHandle オブジェクトを返します。

js
async function* getFilesRecursively(entry) {
  if (entry.kind === "file") {
    const file = await entry.getFile();
    if (file !== null) {
      file.relativePath = getRelativePath(entry);
      yield file;
    }
  } else if (entry.kind === "directory") {
    for await (const handle of entry.values()) {
      yield* getFilesRecursively(handle);
    }
  }
}
for await (const fileHandle of getFilesRecursively(directoryHandle)) {
  console.log(fileHandle);
}

仕様書

Specification

File System
# api-filesystemdirectoryhandle

ブラウザーの互換性

Enable JavaScript to view this browser compatibility table.

関連情報

Help improve MDN

Was this page helpful to you?

Yes No

Learn how to contribute

This page was last modified on 2025年3月26日 by MDN contributors.

View this page on GitHub • Report a problem with this content