preface


Download files can not rename the filename of the need to do many times, today finally solved, so special to record. For downloading files, the DOWNLOAD attribute of h5A tag does not take effect, this is due to cross-domain problems, baidu big Push will not discuss here, I will talk about downloading files through BLOB binary stream mode.

The body of the


This is simply done by converting the file into a binary BLOB object and then creating an A tag with JS to download.

Axios, which I’m using here, is set to BLOB via responseType and returns a BLOB object to download the file.

Success!

To highlight! Remember to add TYPE when creating new Blob instances, otherwise all downloaded files will be converted to TXT files.

Here put the code ~ useful to you please bother to point a thumbs-up oh thank you ~

let link = document.createElement('a'); axios.get(url.qn_url,{ responseType: 'blob', }).then(res=>{console.log(res) let blob = new blob ([res.data]) let objectUrl = url.createObjecturl (blob) // Create a URL link.href = objectUrl; console.log(link) link.download = url.df_name; // Custom file name link.click() // Download the file. URL.revokeObjectURL(objectUrl); // free memory})