Laravel使用snappypdf调用wkhtmltopdf时HTML页脚与页码无法共存如何解决

问题原因 #

SnappyPDF底层基于wkhtmltopdf实现PDF渲染，当你同时配置footer-html自定义HTML页脚和footer-right这类内置文本页脚参数时，内置的页码内容会被渲染在HTML页脚的下层，且默认未配置字体颜色，因此会被HTML页脚的背景遮挡，仅能通过复制操作提取到内容，视觉上表现为透明不可见。

可行解决方案 #

方案一：在自定义HTML页脚中插入页码（最稳定，推荐） #

无需保留footer-right配置，直接修改你的emailFooter Blade模板，在需要显示页码的位置插入对应标识即可：

1. 若你使用的是wkhtmltopdf 0.12.5及以上版本，直接在HTML对应位置插入如下代码，渲染时会自动填充页码数值：

<div style="float: right;">第 <span class="page"></span> 页，共 <span class="topage"></span> 页</div>

2. 若上述方式不生效，可以使用兼容JS写法实现，注意要将逻辑放在window.onload中，避免渲染报错：

<script>
window.onload = function() {
    var queryParams = {};
    var queryStr = window.location.search.substring(1);
    var paramPairs = queryStr.split('&');
    for (var i = 0; i < paramPairs.length; i++) {
        var pair = paramPairs[i].split('=');
        queryParams[pair[0]] = decodeURIComponent(pair[1]);
    }
    document.querySelector('.page').textContent = queryParams.page;
    document.querySelector('.topage').textContent = queryParams.topage;
}
</script>

你之前遇到的退出状态码'-1073741819'报错，一般是wkhtmltopdf版本和JS语法不兼容导致的，换成上述写法或者升级wkhtmltopdf到0.12.6稳定版即可解决。

方案二：同时保留两类配置，调整参数让页码可见 #

如果你不想修改现有HTML页脚，可以保留两类配置，补充如下参数即可正常显示：

->setOption('footer-html', view('front.mail_templates.layouts.emailFooter'))
->setOption('margin-bottom', 25) // 适当调大底部边距，给页码预留足够显示空间
->setOption('footer-right', "Page [page] of [toPage]")
->setOption('footer-font-size', 10) // 设置页码字体大小
->setOption('footer-font-name', 'Arial, SimSun') // 设置字体避免乱码
->setOption('footer-spacing', 5) // 设置页码与页面底部的间距
->setOption('footer-font-color', '#000000') // 强制设置页码为黑色，避免透明不可见

注意要保证你的自定义HTML页脚高度不超过边距预留的上半区域，不要遮挡页码的显示位置。

内容的提问来源于stack exchange，提问作者youss