The first two techniques require us to create anchor tags and assign values to their href and download attributes. In this tutorial, we learned three different techniques of creating and saving files in JavaScript. The demo will not work in Firefox, so you should try using Chrome or Edge. Try writing something in the textarea of the following CodePen, and then click on the Save File button.

At this point, the content from the stream is saved to the file. The createWritable() method creates a writable stream, and we write the blob we created earlier to this stream. This method returns a FileSystemFileHandle on which we can call the createWritable() method. We can suggest a name to save the file here and also pass an array of allowed file types to save. We create an object that contains different options for our file picker that shows up when we call the showFilePicker() method. write ( taBlob ) Īs usual, we begin by creating a blob of the text inside the textarea element. createWritable () Īwait writableFileStream. showSaveFilePicker ( pickerOptions ) Ĭonst writableFileStream = await fileHandle. setAttribute ( ' href ', ' data:text/plain charset=utf-8, ' + encodeURIComponent ( text ))

Javascript download from url