Download uploaded image

[Marcel Epp]

Hello,

i need some help. I have build a upload form which save an image into a site.

How can the visitors of this site now download the uploaded image?

I created a download button. When i click on that, the image shows.

How can i force the browser to download the file? The html 5 download attribute is not an option.

Is there a solution with gives me max browser compatibility?

[kixe]

/**
 * Send the contents of the given filename via http
 *
 * This function utilizes the $content->fileContentTypes to match file extension
 * to content type headers and force-download state.
 *
 * This function throws a WireException if the file can't be sent for some reason.
 *
 * @param string $filename Filename to send
 * @param array $options Options that you may pass in, see $_options in function for details.
 * @param array $headers Headers that are sent, see $_headers in function for details.
 *    To remove a header completely, make its value NULL and it won't be sent.
 * @throws WireException
 *
 */
function wireSendFile($filename, array $options = array(), array $headers = array()) {
    $http = new WireHttp();
    $http->sendFile($filename, $options, $headers);
}

Usage

$file = $page->filefield->first()->filename(); // or $page->filefield->filename(); depending on your settings
wireSendFile($file, array('forceDownload' => true, 'exit' => true));

Example

• Allow url segments in the template where your button and image exists.

$img = $input->urlSegment1? (int) $input->urlSegment1:0;
$download = $input->urlSegment2 == 'download'?true:false;
$file = $page->filefield->eq($img);

if ($download) {
    wireSendFile($file->filename(), array('forceDownload' => true, 'exit' => true));
}
else {
    echo "<img alt='' src='{$file->url}'/>";
    echo "<button><a href='$number/download/'>Download Picture</a></button>";
}

[LostKobrakai]

What kixe said, but to add to this: It's not as simple as adding a button attribute or some different url processwire would provide.

This would need you to have a url (or page, can be the page the button is on), which serves as wrapper for the image file. You then use the url of this page as the source for the download. You probably need some kind of trigger for the download, to differenciate it from normal requests, which is done either via a urlSegments or a GET variable in the url. In the template you can then check for the trigger / filename and run wireSendFile on the file the user does try to download.

[Marcel Epp]

Thanks for your answers!

The first think i had to do, was enable the url segments. That was unclear for me.

I asked a colleague for help. We looked at the example above and get it to work.

$download = ($input->urlSegment1 == 'download');
$file = $page->bildarchiv_images;
$thumb = $page->bildarchiv_thumb;
if ($download) {
  $downloadFilename = '';// ($page->title).'.'.substr(strrchr($file->$filename, "."), 1);
  wireSendFile($file->filename(), array('forceDownload' => true, 'exit' => true, 'downloadFilename' => $downloadFilename));
}
else {
  echo '<div id="basic-site-text" class="row content-box">';
  echo '<div class="medium-9 columns content-box-column-left">';
  echo "<h2>$page->title</h2>";
  if($thumb) echo "<a href=\"./download/\"><img src='$thumb->url'></a>";
  else echo "<a href=\"./download/\"><img src='$file->url'></a>";
  echo "<p><strong>Stichwörter:</strong><br>$page->stichwoerter</p>";
  echo "<p><strong>Copyright:</strong><br>$page->copyright</p>";
  echo "</div>";
  echo '<div class="medium-3 columns content-box-column-right">';
  echo "<a id='search_submit' class=\"expanded button\" href=\"./download/\">Download</a>";
  echo "</div>";
  echo "</div>";
}