如何生成带样式的 PDF 并将其上传到服务器 (Jquery)

Question

我正在尝试生成一个 pdf 文件，将其上传到服务器，而不是直接下载（本地）。所以我尝试了 JsPdf，但 Jspdf 的问题是它不保存我的样式表。然后我尝试了 Html2Pdf（这也适用于我的样式表）但我无法将数据发送到“upload.php”文件。我找不到 html2pdf 的输出语法。JS：$("#printer").on("click",function(e){var element = document.getElementById('qrcode');html2pdf().from(element).toPdf().outputPdf().then(function(pdf) {    //Convert to base 64        var data = new FormData();        data.append("data" , pdf);        var xhr = new XMLHttpRequest();        xhr.open( 'post', 'upload.php', true ); //Post to php Script to save to server        xhr.send(data);        })});我在服务器上的 Pdf 文件是空的。我不知道为什么。上传.php：<?phpif(!empty($_POST['data'])){    $data = $_POST['data'];    $fname = "test.pdf"; // name the file    $file = fopen("uploads/" .$fname, 'w'); // open the file path    fwrite($file, $data); //save data    fclose($file);} else {    echo "No Data Sent";}?>我真的很感激任何帮助。只需要将生成的 PDF 文件保存在我的服务器上。

Answer 1

如果有人遇到同样的问题。我找到了解决方案。

JS

$("#printer").on("click",function(e){

var element = document.getElementById('qrcode');

var opt = {

  image:        { type: 'jpeg', quality: 0.98 },

  html2canvas:  { scale: 3 },

  jsPDF:        { unit: 'cm', format: 'letter', orientation: 'landscape' }

};

html2pdf().from(element).set(opt).toPdf().output('datauristring').then(function (pdfAsString) {

    // The PDF has been converted to a Data URI string and passed to this function.

    // Use pdfAsString however you like (send as email, etc)!

var arr = pdfAsString.split(',');

pdfAsString= arr[1];    

        var data = new FormData();

        data.append("data" , pdfAsString);

        var xhr = new XMLHttpRequest();

        xhr.open( 'post', 'upload.php', true ); //Post the Data URI to php Script to save to server

        xhr.send(data);

        })

e.preventDefault();  //stop the browser from following

    window.location.href = 'uploads/file.pdf';

});

上传.php

<?php

$data = $_POST['data'];

$b64 = $data;

# Decode the Base64 string, making sure that it contains only valid characters

$bin = base64_decode($b64, true);

# Perform a basic validation to make sure that the result is a valid PDF file

# Be aware! The magic number (file signature) is not 100% reliable solution to validate PDF files

# Moreover, if you get Base64 from an untrusted source, you must sanitize the PDF contents

if (strpos($bin, '%PDF') !== 0) {

  throw new Exception('Missing the PDF file signature');

}

# Write the PDF contents to a local file

file_put_contents('uploads/file.pdf', $bin);

?>