0

I have Export to Excel button in my HTML page, onClick of the button i will send GET request to ASP .Net Web API, which which get data from Database and return HTTPContext binary Response. In the front end, i am getting binary data of the Excel file. How to directly download the file once response came?

            HttpContext.Current.Response.ClearContent();
            FileStream objFileStream = new FileStream(filePath, FileMode.Open, FileAccess.Read);
            byte[] excelResponse = new byte[objFileStream.Length];
            objFileStream.Read(excelResponse, 0, excelResponse.Length);
            HttpContext.Current.Response.ContentType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
            HttpContext.Current.Response.AddHeader("Content-Disposition", string.Format("attachment;filename={0}", fileName));
            HttpContext.Current.Response.BinaryWrite(excelResponse);

My front end binary content

PKS��J�ɉ�fxl/workbook.xml �(��P�N�0����SA5������8�����4�Z^���8�I�n"�+�Y�����|}����ጉ�V,����V�����v��OJ�=�

How to download as file? I dont want to use form

Below is the AJAX call i am making on click on Export button.

 // Make AJAX call
    $.ajax({
        type: "GET",
        url: "http://localhost:8899/api/ExportDataToExcel/",
        data: oData,
        headers: {
            "Authorization": "Bearer " + sToken,
        },
        success: function (oResult) {
            onSuccess(oResult);
        },
        error: function (oResponse) {
            onFailure(oResponse);
        }
    });

That's all i am doing on Export to Excel button click.

If i use Form submit, then i am getting Authorization denied error, as the API expects bearer token. Following code gives Authorization denied error

      var form = document.createElement("form")
      form.action = url + 'exportDataToExcel/';
      form.method = "GET";
      document.body.appendChild(form);
      form.submit(true);
      document.body.removeChild(form);
Nanju
  • 1,011
  • 1
  • 7
  • 9
  • What is the code on your front-end? There's quite a few questions asking the same question. For example: https://stackoverflow.com/questions/28165424/download-file-via-jquery-ajax-post – ACOMIT001 Jun 22 '17 at 14:15
  • Possible duplicate of [Download file via jquery ajax post](https://stackoverflow.com/questions/28165424/download-file-via-jquery-ajax-post) – ACOMIT001 Jun 22 '17 at 14:17
  • All posts are explaining with FORM and FORM submit.. If i use form submit and calling the same GET method, then it is working. But Why should i use FORM? – Nanju Jun 22 '17 at 14:34
  • Can you actually add your front-end code here? Without it, no one can help you solve this problem. – ACOMIT001 Jun 22 '17 at 14:39
  • I edited now and added the API method call.. Actually in html only button tag and onclick are there – Nanju Jun 22 '17 at 14:48
  • Have a look at the link to the question I posted above. That should help you get started. – ACOMIT001 Jun 22 '17 at 14:51
  • How can i add Authorization header with bearer token to the form submission? – Nanju Jun 23 '17 at 05:07

1 Answers1

0

I resolved the issue by replacing AJAX with XMLHttpRequest, as AJAX can't receive binary buffer response. Once i received response for XHR, i am creating JavaScript Blob and then anchor tag and redirecting that anchor element to BlobObjectURL.

Nanju
  • 1,011
  • 1
  • 7
  • 9