在包括图像的 ajax HTML 数据上创建 PDF

Question

function CallFuncation() {
  $.ajax({
    type: "POST",
    url: "Method",
    data: '',
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(GetData) {
      //generated pdf with download including images

    }
  });
}

我们的 ajax 响应数据如下

GetData = "<h1>Employee List</h1><table border="1" width="100%"><tbody><tr><th>Sr. No</th><th>Name</th><th>Email</th><th>Photo</th></tr><tr><td>1</td><td>Alpesh</td><td>alpesh@gmail.com</td><td><img width="50px" src="images/1.jpg"></td></tr><tr><td>2</td><td>Rajesh</td><td>rajesh@gmail.com</td><td><img width="50px" src="images/2.jpg"></td></tr></tbody></table>"

我们要求以 pdf 格式输出，如下图所示。

Answer 1

有几种可能的方法可以做到这一点，如果你想在客户端用js生成pdf，你必须使用像jsPDF这样的库，但问题是你必须把图片的url变成base64字符串，您可以使用using FileReader API 或画布，在这两种情况下，您都必须从响应中提取图像的 url。

在我看来，另一种更简单的方法是使用诸如wkhtmltopdf 之类的库在服务器中创建 pdf。