Output byte array as PDF from javascript

[epb]

Hi all

I have the following ajax call from a webpage. The url points to a webservice (C#) which returns a PDF file as a byte array. How do I output the byte array (in the variable 'result') as a PDF for the user to save using javascript?

$.ajax({
                type: "GET",
                async: "false",
                url: url,
                data: "",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                processData: true,
                cache: false,
                success: function (result) {
                    // TODO: What to do here??
                },
                error: function(xmlHttpRequest, textStatus, errorThrown) {
                    alert(errorThrown.message);
                }
            });

[rnd me]

you need to turn your array into a string, which i can't advise on without seeing an example server response.

once you have a binary string, it's easy enough to download in newer browsers:

function download(strData, strFileName, strMimeType){
  var  D=document, A=arguments, a=D.createElement("a"), 
       d=A[0], n=A[1], t=A[2]||"text/plain";

    //build download link:
       a.href="data:" +strMimeType+ "," +escape(strData);

if('download' in a){
     a.setAttribute("download", n);
     a.innerHTML="downloading...";
     D.body.appendChild(a);
    setTimeout(function(){
	var e= D.createEvent("MouseEvents");
	e.initMouseEvent(
		"click", true, false, window, 0, 0, 0, 0, 0
		, false, false, false, false, 0, null
	);
       a.dispatchEvent(e);
       D.body.removeChild(a);
    }, 66 );
  return true;
};//end if a[download]?

 //do iframe dataURL download:
    var f=D.createElement("iframe");
       D.body.appendChild(f);
        f.src="data:" +(A[2]?A[2]:"application/octet-stream")+ (window.btoa?";base64":"") +","  +(window.btoa?window.btoa:escape)(strData);
        setTimeout(function(){D.body.removeChild(f);}, 333);
    return true;
}//end download()


//example usage:
download("hello world", "test.txt", "text/plain")

you syntax would be something like

download( result.chars.join(""), report.pdf", "application/pdf");

at this point, only chrome will respect the filename, with firefox adding support in feb or april. It still will download correctly without the file-name, but you have to rename it on the OS, something which is not always user-friendly.


see https://github.com/dcneiner/Downloadify for an IE-friendly version that uses flash.