Download in browser with ajax request
UPDATE
The method of using FileSaver.js also doesn't work , there seems to be no way to forcefully invoke the native Save As Dialog via JavaScript alone , only exception being the saveAs execCommand
for IE. Check Does execCommand SaveAs work in Firefox?
Include FileSaver.js as dependency in your project
Change the downloadPDF
function as follows
$scope.downloadPDF = function() { $http.post('/download-pdf', { fid: $routeParams.fid }, { responseType: 'arraybuffer' }) .success(function(data, status, headers, config) { // Convert response data to Blob var file = new Blob([data], { type: 'application/pdf' }); // Call the File Saver method to save the above Blob,this will show Save As dialog saveAs(file, "test.pdf"); }) .error(function(data, status, headers, config) { console.log("error"); }); };
The Blob
object will work in most modern browser but there is limited support for IE < 10 , check https://github.com/eligrey/FileSaver.js#supported-browsers for polyfills
Also remove Content-Disposition: attachment
and Content-Type: application-download
headers as we don't want browser to natively handle the download process
Here is a working demo http://plnkr.co/edit/9r1tehQ94t5vkqZfZuQC?p=preview , it shows GET request to a PDF
Let me suggest you one thing.
By AJAX only you cannot download any file. You need to create .zip file first with ajax call and after that gaining that file path you have to open that file using any command.
Here one example that works for me: :)
$http.post('www.abc.com/zipcreate', {'id': id}).then(function (zipurl) { $window.location = zipurl; });
Surely, It works. Try once. :)
EDIT:
Or you can use
$window.location = 'abc.com/link';
in 'abc.com/link' : use below code:
header("Content-type: application/octet-stream"); header("Content-Disposition: attachment; filename=".$name); header("Pragma: no-cache"); header("Expires: 0"); readfile($file); exit;
You will get your file in download-list.
According to the documentation you can set the 2nd parameter to D
:
$pdf->Output('Order123.pdf', 'D');
If you want to handle all the details yourself using a saved file, this is how I've presented PDFs to the browser for download from PHP:
header('Pragma: public');header('Expires: 0');header('Cache-Control: must-revalidate, post-check=0, pre-check=0');header('Content-Type: application-download');header('Content-Length: ' . filesize('file.pdf'));header('Content-Transfer-Encoding: binary');header('Content-Disposition: attachment; filename="file.pdf"');$handle = fopen('file.pdf', 'rb');fpassthru($handle);fclose($handle);
Update:
Please verify that the PDF file is actually being made. Does the web server process have write access to that path? Is FPDF being included properly? I made this on a test VM and it presented a file 1.pdf
for download, which opened and contained "Hello World!":
<?phprequire('/var/www/html/fpdf17/fpdf.php');$_POST = array('fid' => '1');$pdf = new FPDF();$pdf->AddPage();$pdf->SetFont('Arial', 'B', 16);$pdf->Cell(40, 10, 'Hello World!');$filename = '/tmp/' . $_POST['fid'] . '.pdf';$pdf->Output($filename, 'F'); // Save file locallyheader('Pragma: public');header('Expires: 0');header('Cache-Control: must-revalidate, post-check=0, pre-check=0');header('Content-Type: application-download');header('Content-Length: ' . filesize($filename));header('Content-Transfer-Encoding: binary');header('Content-Disposition: attachment; filename="' . basename($filename) . '"');$handle = fopen($filename, 'rb');fpassthru($handle);fclose($handle);unlink($filename);?>