FileSystemWritableFileStream

Baseline 2025

Newly available

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

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

File System Access API の FileSystemWritableFileStream インターフェイスは、便利なメソッドが追加された WritableStream オブジェクトで、ディスク上の単一のファイルを扱います。このインターフェイスには FileSystemFileHandle.createWritable() メソッドを通じてアクセスします。

WritableStream FileSystemWritableFileStream

インスタンスプロパティ

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

インスタンスメソッド

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

FileSystemWritableFileStream.write

メソッドが呼ばれたファイルの現在のファイルカーソルオフセットにデータを書き込みます。

FileSystemWritableFileStream.seek

現在のファイルカーソルオフセットを指定の位置 (バイト単位) に移動します。

FileSystemWritableFileStream.truncate

ストリームに対応するファイルのサイズを指定のバイト数にします。

例

この非同期関数は「Save File」ピッカーを開き、このピッカーはファイルが選択されると FileSystemFileHandle を返します。そして、FileSystemFileHandle.createWritable() メソッドを用いて、このハンドルから書き込み可能なストリームを作成します。

その後、ユーザーが指定した Blob をストリームに書き込み、ストリームを閉じます。

js
async function saveFile() {
  // 新しいハンドルを作成する
  const newHandle = await window.showSaveFilePicker();

  // 書き込み先の FileSystemWritableFileStream を作成する
  const writableStream = await newHandle.createWritable();

  // ファイルに書き込む
  await writableStream.write(imgBlob);

  // ファイルを閉じ、データをディスクに書き込む
  await writableStream.close();
}

以下では、write() メソッドに渡すことができる異なるオプションの例を示しています。

js
// データだけを渡す (オプションなし)
writableStream.write(data);

// ストリームに指定の位置からデータを書き込む
writableStream.write({ type: "write", position, data });

// 現在のファイルカーソルオフセットを指定の位置に移動する
writableStream.write({ type: "seek", position });

// ファイルを size バイトにする
writableStream.write({ type: "truncate", size });