wkhtmltopdf：在页脚显示内容，例如页码答案

【问题标题】：wkhtmltopdf: show content on footer, for example page numberwkhtmltopdf：在页脚显示内容，例如页码
【发布时间】：2017-01-05 18:58:53
【问题描述】：

我希望这个命令会在生成的 pdf 的引导处显示 1/1，但没有……知道吗？

wkhtmltopdf --footer-center [page]/[topage] www.google.com /tmp/foobar.pdf

版本：Linux 上的 0.12.2.4

【问题讨论】：

会发生什么？只显示'/'还是什么都不显示？
@RafaelDantas 什么也没显示
出于测试目的，请使用 --header-center 并查看是否有效。（尝试在属性文本中加上双引号）

标签： wkhtmltopdf html-to-pdf

【解决方案1】：

我认为这个问题可能是由于版本 0.12.2.4 造成的，否则，这个 --footer-center [page]/[topage] 命令将完成你的工作。

还有一个例子，我检查过substitutePdfVariables() 在body onload 中被调用。

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <script>
        function substitutePdfVariables() {

            function getParameterByName(name) {
                var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
                return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
            }

            function substitute(name) {
                var value = getParameterByName(name);
                var elements = document.getElementsByClassName(name);

                for (var i = 0; elements && i < elements.length; i++) {
                    elements[i].textContent = value;
                }
            }

            ['frompage', 'topage', 'page', 'webpage', 'section', 'subsection', 'subsubsection']
                .forEach(function(param) {
                    substitute(param);
                });
        }
    </script>
</head>
<body onload="substitutePdfVariables()">
    <p>Page <span class="page"></span> of <span class="topage"></span></p>
</body>
</html>

这里Docs你可以找到更多关于页眉和页脚的变量。

【讨论】：

Docs 似乎已经过时了......关于 linux 版本的猜测似乎与之前的答案相似。
@AmberBeriwal ，我已经重新更改了文档超链接。我认为从这个答案中，用户可以得到他们的答案。

【解决方案2】：

似乎是一个稳定性问题，但对于 linux（debian 或 ubuntu）还没有稳定版本的 0.12.2.4 版本，但 仅用于上述调试目的在他们的存储库中here。

这是version 和0.12.4 的工作屏幕截图

版本0.12.4

或者您可以通过下面的sn-p添加页码以添加提到的页脚here

  <html><head><script>
  function subst() {
    var vars={};
    var x=window.location.search.substring(1).split('&');
    for (var i in x) {var z=x[i].split('=',2);vars[z[0]] = unescape(z[1]);}
    var x=['frompage','topage','page','webpage','section','subsection','subsubsection'];
    for (var i in x) {
      var y = document.getElementsByClassName(x[i]);
      for (var j=0; j<y.length; ++j) y[j].textContent = vars[x[i]];
    }
  }
  </script></head><body style="border:0; margin: 0;" onload="subst()">
  <table style="border-bottom: 1px solid black; width: 100%">
    <tr>
      <td class="section"></td>
      <td style="text-align:right">
        Page <span class="page"></span> of <span class="topage"></span>
      </td>
    </tr>
  </table>
  </body></html>

【讨论】：