如何使用 PhantomJS 在生成的 PDF 中显示已处理页面的 url？

Question

我的目标是从使用 Rails 创建的网站的站点地图中包含的每个页面生成 PDF。我正在使用 PhantomJS 来获取它。我在这个领域很新，但我可以做到，但是当我完成后，我意识到在每个 PDF 的开头也可以看到 PDF 所在页面的 url已生成，因此我可以更快地浏览到该页面（该站点有一百多个页面）。

这是Javascript:

// Render Sitemap to file

var RenderUrlsToFile, arrayOfUrls, system;

system = require("system");

/*
Render given urls
@param array of URLs to render
@param callbackPerUrl Function called after finishing each URL, including the last URL
@param callbackFinal Function called after finishing everything
*/

var getFileNumber = function(urlIndex) {
  if (urlIndex <10) {
    return "00" + urlIndex;
  } else {
    if (urlIndex <100) {
      return "0" + urlIndex;
    } else {
      return urlIndex;
    }
  }
};

RenderUrlsToFile = function(urls, callbackPerUrl, callbackFinal) {
    var getFilename, next, page, retrieve, urlIndex, webpage;
    urlIndex = 0;
    webpage = require("webpage");
    page = null;
    getFilename = function() {
    return "rendermulti-" + getFileNumber(urlIndex) + ".pdf";
    };
    next = function(status, url, file) {
        page.close();
        callbackPerUrl(status, url, file);
        return retrieve();
    };
    retrieve = function() {
        var url;
        if (urls.length > 0) {
            url = urls.shift();
            urlIndex++;
            page = webpage.create();
            page.viewportSize = {
                width: 1920,
                height: 1880
            };
            page.settings.userAgent = "Phantom.js bot";
            return page.open(url, function(status) {
                var file;
                file = getFilename();
                if (status === "success") {
                    return window.setTimeout((function() {

                      // !!!!!!!!!!!!! Doesn't work !!!!!!!!!!!!!!!!!!!!!!!!!!!!!
                      page.evaluate(function() {
                        var x = document.getElementById("logoAndNavigation");
                        var newP = document.createElement("P")
                        var textnode = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
                        newP.appendChild(textnode)
                        x.insertBefore(newP, x.childNodes[0]);
                      });
                      // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
                      page.render("tempPdfs/" + file);
                      return next(status, url, file);
                    }), 200);
                } else {
                    return next(status, url, file);
                }
            });
        } else {
            return callbackFinal();
        }
    };
    return retrieve();
};

// This makes an array with all the urls inside the sitemap
var arrayOfUrls = [''];
var page = require('webpage').create();
page.open('http://localhost:3000/sitemap.xml', function() {
  var content = page.content;
  parser = new DOMParser();
  xmlDoc = parser.parseFromString(content,'text/xml');
  var loc = xmlDoc.getElementsByTagName('loc');
  for(var i=0; i < loc.length; i++)
  {
    var url=loc[i].textContent;
    arrayOfUrls.push(url);
  }
});




RenderUrlsToFile(arrayOfUrls, (function(status, url, file) {
    if (status !== "success") {
        return console.log("Unable to render '" + url + "'");
    } else {
        return console.log("Rendered '" + url + "' at '" + file + "'");
    }
}), function() {
    return phantom.exit();
});

我试图用 url 解决这个问题，代码用注释

// !!!!!!!!!!!!! Doesn't work !!!!!!!!!!!!!!!!!!!!!!!!!!!!!

我想在页面元素内显示 url，该元素具有 ID #logoAndNavigation，但出现此错误：

NOT_FOUND_ERR：DOM异常 8：试图在不存在的上下文中引用节点。

如果我在变量 textnode 中只使用像 "hello" 这样的字符串，它会起作用，但如果我尝试使用页面的 url 则不起作用。

谁能帮帮我？提前致谢！

Answer 1

appendChild 需要一个节点而不是字符串。您可能想使用

var x = document.getElementById("logoAndNavigation");
var newP = document.createElement("p"); // small p
var textnode = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
newP.innerHTML = textnode; // this
x.insertBefore(newP, x.childNodes[0]);

您也可以使用 printheaderfooter.js 的示例将 URL 直接添加到页眉或页脚。

如何使用 PhantomJS 在生成的 PDF 中显示已处理页面的 url？

How can I show with PhantomJS the url of the processed page in the generated PDF?

javascript

pdf

phantomjs