强制下载PHP生成的二维码图像 - Force Download of PHP generated QR code Image

我正在使用Endroid''QrCode用PHP生成QR码。这一切都很好用，但我还是会发布代码。我正在尝试向我的页面添加一个下载按钮，使其更加用户友好，而不是必须右键单击图像并从上下文菜单中选择另存为。但是，它不是下载图像（.png）文件，而是将当前页面下载为.htm文件。对于PHP生成的图像而不仅仅是原始的png图像，是否有不同的方法可以做到这一点？

.PHP：

<?php require_once '../control.php';
require_once '../vendor/autoload.php';
use Endroid'QrCode'QrCode;
$qrCode = new QrCode();

if($_GET['url'] != ''){
    $qrCode->setText($_GET['url']);
} else {
    $qrCode->setText(SITEHTMLROOT);
}
if($_GET['size'] != ''){
    $qrCode->setSize($_GET['size']);
} else {
    $qrCode->setSize(200);
}
if($_GET['padding'] != ''){
    $qrCode->setPadding($_GET['padding']);
} else {
    $qrCode->setPadding(10);
}
if($_GET['label'] != ''){
    $qrCode->setLabel($_GET['label']);
}
if($_GET['text_size'] != ''){
    $qrCode->setLabelFontSize($_GET['text_size']);
} else {
    $qrCode->setLabelFontSize(16);
}
$qrCode
    ->setErrorCorrection('high')
    ->setForegroundColor(array('r' => 0, 'g' => 0, 'b' => 0, 'a' => 0))
    ->setBackgroundColor(array('r' => 255, 'g' => 255, 'b' => 255, 'a' => 0))
    ->render()
;
?>

Javascript：

var getQRCode = function () {
  var url = $('#site_url').val();
  var size = $('#qr_size').val();
  var padding = $('#qr_padding').val();
  var label = $('#qr_label').val();
  var text_size = $('#qr_text_size').val();
  var QRcode = $('#final_QRCode');
  var get = '?url=' + url +'&&size=' + size + '&&padding=' + padding + '&&label=' + 
    label + '&&text_size=' + text_size;
  QRcode.attr('src', htmlroot + 'cgi/qrcode.php' + get);
  $('#qr_code_download').attr('src',  htmlroot + 'cgi/qrcode.php' + get);
};

HTML 按钮和图像：

<label>Your QR Code</label>
<div class="row"><img src="" id="final_QRCode" /></div>
<a href="#" id="qr_code_download" download="My QR Code">
  <div class="button special fit">Download This QR Code</div></a>

图片网址格式：

http://www.example.com/qrcode.php?url=myurl.html&size=300&padding=10&label=&text_size=16

为确保获取正确的网址，请查看浏览器的开发者工具网络选项卡。我建议对javascript代码进行以下修改应该会有所帮助 - 添加CDATA括号意味着您可以在不破坏HTML验证的情况下使用内部的任何字符，并且URL应该具有单与号来分隔参数而不是双与号。

<script type="text/javascript"><![CDATA[
var getQRCode = function () {
  var url = $('#site_url').val();
  var size = $('#qr_size').val();
  var padding = $('#qr_padding').val();
  var label = $('#qr_label').val();
  var text_size = $('#qr_text_size').val();
  var QRcode = $('#final_QRCode');
  var get = '?url=' + url +'&size=' + size + '&padding=' + padding + '&label=' + label + 
    '&text_size=' + text_size;
  QRcode.attr('src', htmlroot + 'cgi/qrcode.php' + get);
  $('#qr_code_download').attr('href',  htmlroot + 'cgi/qrcode.php' + get);
};
]]></script>

此外，可能值得在 PHP 脚本中添加一些 HTTP 标头，以确保浏览器理解它正在接收的内容类型，就在 QR 码渲染语句之前，然后故意省略结束 PHP 标记，因为这会允许尾随空格干扰输出：

<?php
header( 'Content-type: image/png' );
$qrCode->setErrorCorrection('high')
  ->setForegroundColor(array('r' => 0, 'g' => 0, 'b' => 0, 'a' => 0))
  ->setBackgroundColor(array('r' => 255, 'g' => 255, 'b' => 255, 'a' => 0))
  ->render();
exit;