AJAX + PHP + Download mPDF generated file

Question

I'm creating an app where the user has an access to view many PDF presented him in a table. Each row also has checkbox which allow user to check or not for the next action that i will describe later.

These checkboxes are within form tags and after that there is a submit button which send all files ID inside an array by POST METHOD through the AJAX REQUEST to the PHP file.

The AJAX Request looks like this:

$.ajax({
    url: link,
    type: 'POST',
    data: $(this).serialize(),
    success: function(result) {

        if (result == 'ok') {

            if (redirect) {
                window.location.replace(redirect);
            } else {
                window.location.reload();
            }

        } else {

            if (callback) {
                $('#' + callback).html('<div>' + result + '</div>');
            } else {
                alert(result);
            }   

        }

    }
});

So nothing special, all post data is taken and send to the specific PHP file.

Moving further, on the PHP file side - there is an algorithm which check if user has an access to all files by received throught post method ID's. So there is a simple loop combined with SQL query.

When the LOOP verify that he has a valid access - I'm creating one big file consists of all the files he choose by previous checkboxes. I'm using in this case mPDF and merging files are not a problem to me.

The merged file is then created on the server and has a specific name.

And now - as I said before, this file should be very private so after the user download it, I want the script to also delete this file. But I can't handle with the part of downloading it.

I've tried to send headers from a PHP file side but it ends like strange characters are outputed into the callback div element instead of showing download dialog.

My code for sending headers looks like below

$file = __PATH_TO_FILE__ . 'MaJjYzA4OGE4N2Q0MjUwNmJkZDQ0ZmZm.pdf'; //file which in fact exists

header('Content-type:  application/download'); //or event tried with application/pdf => no difference
header('Content-Length: ' . filesize($file));
header('Content-Disposition: attachment; filename="'. $file .'"');
return readfile($file);

For summary, instead of prompt dialog + download - the strange characters cover callback area.

If you guys know what's going on and what should I make in this specific scenario, I will be glad for help. Also, I will be more thankful if you suggest me what to do with deleting file after the user downloads it or even cancel the prompt dialog so the file will no longer stay on the server.

Answer 1

You need to return a link to your file from ajax

$file = __PATH_TO_FILE__ . 'MaJjYzA4OGE4N2Q0MjUwNmJkZDQ0ZmZm.pdf'; //file which in fact exists
echo $file;

in you ajax success you simply open a new window to that file;

success: function(file) {
   window.open(file);
}

another solution will be to use a hidden download link

  success: function(file) {
       $('body').append('<a href="'+file+'" class="hiddenLink" download style="display:none;"></a>');
      $('.hiddenLink').trigger('click');//or $('.hiddenLink')[0].click();
    }