Window.showSaveFilePicker()

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

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

Window インターフェイスの showSaveFilePicker() メソッドは、ファイルピッカーを表示し、ユーザーにファイルを保存させることができます。 既存のファイルを選択することも、新規ファイルの名前を入力することもできます。

構文

js
showSaveFilePicker()

引数

options 省略可

以下のオプションを含むオブジェクトです。

excludeAcceptAllOption

boolean 値で、デフォルトは false です。 通常、ピッカーには (以下の type オプションに基づく) ファイル形式フィルターを何も適用しない選択肢があるはずです。このオプションを true にすると、この選択肢を利用 不可能 にします。

suggestedName

提案するファイル名を表す String です。

types

保存できるファイル形式の配列です。各要素は、以下のオプションを持つオブジェクトです。

description

許可されるファイル形式のカテゴリーの説明で、省略可能です。

accept

キーを MIME タイプに、値をファイルの拡張子の配列に設定した Object です。(例は以下を参照してください)

返値

FileSystemFileHandle オブジェクトで解決する Promise を返します。

例外

AbortError

ユーザーがファイルの選択や入力をせずにピッカーを閉じた場合や、選択されたファイルをユーザーエージェントがセンシティブや危険とみなした場合、投げられます。

セキュリティ

ユーザーによる一時的な有効化が必要です。この機能が動作するためには、ユーザーがページまたは UI 要素を操作することが必要です。

以下の関数は、テキストファイルが選択しやすい状態でファイルピッカーを表示します。

js
async function getNewFileHandle() {
  const opts = {
    types: [
      {
        description: "テキストファイル",
        accept: { "text/plain": [".txt"] },
      },
    ],
  };
  return await window.showSaveFilePicker(opts);
}

仕様書

Specification
File System Access
# api-showsavefilepicker

ブラウザーの互換性

BCD tables only load in the browser

関連情報