Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How to use POST request to implement browser download EXCEL function .Or, should I not use POST?

I have done some EXCEL file export functions before, but they are all implemented using GET requests. The method I use is like this

// export excel module
handleExportTemplate:_debounce(function(){
  window.location.href = process.env.BASE_API + `/export/excelDownload`
}),

I used the [window.location.href] method to let the browser download Excel automatically, but today the back-end engineer asked me to use a POST request and pass the parameters to him in the body. The data is similar to this:

data:{
userIdList:["1","2","3","4","5"],
ifShow:true,
ifDownLoadNow:true,
}

but using window.location.href, I don’t know how to return these parameters to the backend engineer

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

In addition, I tried sending it to him using a normal POST request, and he did successfully return a file to me, but I couldn’t get the browser to download it automatically through window.location.href

I tried to convince him to use GET request for this function, but he won’t listen to me.
Is it really appropriate to use POST for download requests? Is he wrong or I know too little? If it’s my fault, how can I complete the POST request and be able to download EXCEL?

>Solution :

There is no problem in using a POST request to download a file. Especially when you create your file with many data. In that case, a get request is limited in length, where a POST is not.

I do not know any way to send a POST request using only window.location.href, but what you want can be achieved with JavaScript.

One way is to use the fetch API :


const resp = await fetch('/your/url',{ method : 'POST', body : { /**@ your data **/ } });
const fileContent = await resp.text();

And then, you can make the browser download the file by using a function like this :

function download(filename, text) {
  var element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
  element.setAttribute('download', filename);

  element.style.display = 'none';
  document.body.appendChild(element);

  element.click();

  document.body.removeChild(element);
}

It will create an invisible link temporarily with the download attribute and automatically click it to download the in-memory file.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading