DataTransferItem.getAsFileSystemHandle()

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

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

getAsFileSystemHandle() は DataTransferItem インターフェイスのメソッドで、ドラッグ中の項目がファイルであれば FileSystemFileHandle (en-US) を、ドラッグ中の項目がディレクトリーであれば FileSystemDirectoryHandle (en-US) を返します。

構文

getAsFileSystemHandle()

引数

なし。

返値

Promise で、FileSystemFileHandle (en-US) または FileSystemDirectoryHandle (en-US) で履行されます。

例外

なし。

例

この例では、getAsFileSystemHandle メソッドを使用して、ドロップした項目に対して ファイルハンドル (en-US) を返します。

elem.addEventListener('dragover', (e) => {
  // ナビゲーションを防ぐ
  e.preventDefault();
});
elem.addEventListener('drop', async (e) => {
  // ナビゲーションを防ぐ
  e.preventDefault();

  // すべてのアイテムを処理する
  for (const item of e.dataTransfer.items) {
    // ファイルやディレクトリーの項目では、kind は 'file' になる
    if (item.kind === 'file') {
    const entry = await item.getAsFileSystemHandle();
      if (entry.kind === 'file') {
        // 項目がファイルのとき、コードを実行する
      } else if (entry.kind === 'directory') {
        // 項目がディレクトリーのとき、コードを実行する
      }
    }
  }
});

仕様書

Specification
File System Access
# dom-datatransferitem-getasfilesystemhandle

ブラウザーの互換性

BCD tables only load in the browser

関連情報