So if you don’t need the old URL anymore, you should call the revokeObjectURL() API to free them. For example, if we name the file as *.csv and give it type: 'text/csv', Firefox will recognize it as “CSV document” and suggest you open it with LibreOffice Calc.Īnd in the last line we assign the url to the element’s href attribute, so when the user clicks on the link, the browser will initiate an download action (or other default action for the specific file type.)Įverytime you call createObjectURL(), a new object URL will be created, which will use up the memory if you call it many times. Other commonly seen formats include application/json and text/csv. Downloading the File Assuming you already perform authenticated calls to your back-end using some kind of API client, downloading the file will be straightforward: you will instantiate your client in your component, and call your back-end (here, it is done with ). If you assign the correct format, the browser can better handle the file. In this, we simply forward the download process to the browser to manage it natively. Notice that you can assign the type of the data in the new Blob() constructor.

The URL lives as long as the document in the window on which it was created.

The magic happens on the third line, the () API takes a Blob and returns an URL to access it. Var url = (data) ĭocument.getElementById('download_link').href = url Send files to the server using XMLHttpRequest or store and submit with form post as base64 using the File Encode plugin.

Javascript download file to client