Window: showSaveFilePicker() method
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Secure context: This feature is available only insecure contexts (HTTPS), in some or allsupporting browsers.
Experimental:This is anexperimental technology
Check theBrowser compatibility table carefully before using this in production.
TheshowSaveFilePicker()
method of theWindow
interface shows a file picker that allows a user to save a file.Either by selecting an existing file, or entering a name for a new file.
Syntax
showSaveFilePicker()showSaveFilePicker(options)
Parameters
options
OptionalAn object containing options, which are as follows:
excludeAcceptAllOption
OptionalA boolean value that defaults to
false
. By default, the picker should include an option to not applyany file type filters (instigated with the type option below). Setting this optiontotrue
means that option isnot available.id
OptionalBy specifying an ID, the browser can remember different directories for differentIDs. If the same ID is used for another picker, the picker opens in the samedirectory.
startIn
OptionalA
FileSystemHandle
or a well known directory ("desktop"
,"documents"
,"downloads"
,"music"
,"pictures"
, or"videos"
) to open the dialog in.suggestedName
OptionalA
String
. The suggested file name.types
OptionalAn
Array
of allowed file types to save. Eachitem is an object with the following options:description
OptionalAn optional description of the category of filestypes allowed. Default to be an empty string.
accept
An
Object
with the keys set to theMIME type and the values anArray
of file extensions (see belowfor an example).
Return value
APromise
whose fulfillment handler receives aFileSystemFileHandle
object.
Exceptions
AbortError
DOMException
Thrown if the user dismisses the file picker without selecting or inputting a file,or if the user agent deems any selected files too sensitive or dangerous.
SecurityError
DOMException
Thrown if the call was blocked by thesame-origin policy or it was not called via a user interaction such as a button press.
TypeError
Thrown if accept types can't be processed, which may happen if:
- Any key string of the
accept
options of any item intypes
options can't parse a valid MIME type. - Any value string(s) of the
accept
options of any item intypes
options is invalid, for example, if it does not start with.
and if end with.
, or if it contains any invalid code points and its length is more than 16. - The
types
options is empty and theexcludeAcceptAllOption
options istrue
.
- Any key string of the
Security
Transient user activation is required. The user has to interact with the page or a UI element in order for this feature to work.
Examples
The following function shows a file picker, with text files highlighted for selection.
async function getNewFileHandle() { const opts = { types: [ { description: "Text file", accept: { "text/plain": [".txt"] }, }, ], }; return await window.showSaveFilePicker(opts);}
Specifications
Specification |
---|
File System Access # api-showsavefilepicker |