javascript - 为 iText 预处理 HTML CSS JS

Question

我正在尝试使用嵌入在Java代码中的iText将使用HTML/CSS/JS构建的网页转换为PDF。然而，iText 告诉我们，虽然 pdfHTML 支持 CSS，但它不支持 JS。他们建议使用预处理器“运行”页面中的 Javascript 并获取原始 HTML。

没有 Javascript，iText 可以很好地生成 PDF。但是，我们需要能够将服务调用中的数据注入(inject)到 HTML 中。我使用 JQuery 来完成此任务。我们还调用并使用 FusionCharts API 来渲染一些图表。这些在 PDF 生成之前也一直有效。

有人知道这样的事情吗？它还需要能够从我们的 Java 后端调用。

谢谢!

Answer 1

有多种方法可以在 HTML + CSS + JS 页面上评估 JS 代码。为此，我们需要一个浏览器的类似物(或浏览器本身)，因为通过 DOM 操作来评估 JS 正是浏览器在渲染页面之前必须要做的事情。

选项 1

使用HtmlUnit - “Java 程序的无 GUI 浏览器”。

首先，我们需要添加依赖项(例如通过 Maven):

<dependency>
  <groupId>net.sourceforge.htmlunit</groupId>
  <artifactId>htmlunit</artifactId>
  <version>2.32</version>
</dependency>

然后，打开页面，等待 JS 完成其工作并将页面源代码提供给 iText pdfHTML:

WebClient webClient = new WebClient();
// You might need this configuration if HtmlUnit fails without it
webClient.getOptions().setThrowExceptionOnScriptError(false);
webClient.waitForBackgroundJavaScript(10 * 1000);
HtmlPage page = webClient.getPage(url);
String xml = page.asXml();

ConverterProperties properties = new ConverterProperties().setBaseUri(url);
HtmlConverter.convertToPdf(source, new PdfWriter("result.pdf"), properties);

HtmlUnit 不完全支持 JS，因此在评估 JS 代码时可能会抛出错误。因此，您可能想要抑制它们(我已将此配置和有关它的注释添加到代码示例中)。当然，您的结果可能看起来不正确。但这是纯Java解决方案。

选项 2

向我们每天使用的现实世界浏览器寻求帮助

我们日常使用的浏览器(Chrome、Firefox、Safari等)对JS评测的支持最好。您可以使用浏览器引擎，例如Selenium网络自动化工具。我们要做的是在浏览器中打开一个页面，等待页面加载，然后使用源代码进行 HTML -> PDF 转换。我的示例适用于 Chrome，但您可以对其他浏览器以类似的方式进行操作。首先，您需要download Chrome 驱动程序并将其解压到系统上的某个位置。

然后添加以下 Maven 依赖项:

<dependency>
  <groupId>org.seleniumhq.selenium</groupId>
  <artifactId>selenium-chrome-driver</artifactId>
  <version>3.14.0</version>
</dependency>
<dependency>
  <groupId>org.seleniumhq.selenium</groupId>
  <artifactId>selenium-java</artifactId>
  <version>3.14.0</version>
</dependency>

现在我们必须编写一些代码，类似于第一个选项:

System.setProperty("webdriver.chrome.driver", "C:\\path\\to\\chromedriver.exe");
ChromeDriver driver = new ChromeDriver();
driver.get(url);
new WebDriverWait(driver, 20).until(
        webDriver -> ((JavascriptExecutor) webDriver).executeScript("return document.readyState").equals("complete"));
String source = driver.getPageSource();
driver.close();

ConverterProperties properties = new ConverterProperties().setBaseUri(url);
HtmlConverter.convertToPdf(source, new PdfWriter("result.pdf"), properties);

此选项可能会慢一些，并且有更多先决条件(浏览器、驱动程序)，但它保证了防弹 JS 支持。