使用Kendo中间插件生成PDF：传Base64至PHP得空白PDF问题

我之前也碰到过几乎一模一样的问题，大概率是Base64数据处理、前端传递或者PHP解码环节出了纰漏，给你梳理几个排查和解决的方向：

很多时候空白PDF的根源是Kendo生成的原始数据就有问题，先排除这个可能性：

• 用Kendo自带的saveAs方法直接在前端下载PDF，看看文件是否正常：

kendo.drawing.drawDOM($("#your-content-element"))
  .then(function(group) {
    return kendo.drawing.exportPDF(group, { paperSize: "A4" });
  })
  .done(function(data) {
    // 直接在前端下载测试
    kendo.saveAs({
      dataURI: data,
      fileName: "test-frontend.pdf"
    });
  });

如果这个前端直接生成的PDF也是空白，那问题出在Kendo的渲染环节：比如目标元素隐藏、样式冲突（比如绝对定位元素未被正确捕获）、字体加载失败等，需要先调整Kendo的drawDOM配置或页面样式。

如果前端生成的PDF正常，那大概率是传递给PHP的Base64数据有问题：

• 必须去掉Data URI前缀：Kendo返回的data是完整的data:application/pdf;base64,xxxxxx格式，后端解码时不需要前面的前缀，一定要剥离：

kendo.drawing.drawDOM($("#your-content-element"))
  .then(function(group) {
    return kendo.drawing.exportPDF(group, { paperSize: "A4" });
  })
  .done(function(data) {
    // 剥离前缀，只保留纯Base64字符串
    const pureBase64 = data.replace(/^data:application\/pdf;base64,/, "");
    // 发起POST请求
    $.ajax({
      url: "generate-pdf.php",
      type: "POST",
      data: { pdfData: pureBase64 },
      success: function(res) {
        // 处理后端返回的下载响应
        const blob = new Blob([res], { type: "application/pdf" });
        const url = URL.createObjectURL(blob);
        const a = document.createElement("a");
        a.href = url;
        a.download = "generated.pdf";
        a.click();
        URL.revokeObjectURL(url);
      },
      error: function(xhr) {
        console.error("请求失败：", xhr.responseText);
      }
    });
  });

• 检查POST数据长度：如果PDF内容较大，要确保PHP配置允许足够大的POST请求，修改php.ini中的参数：

post_max_size = 64M
upload_max_filesize = 64M
memory_limit = 128M

后端的解码和输出错误是导致空白PDF的常见原因，参考以下正确实现：

<?php
// 确保字符编码统一
header('Content-Type: application/pdf; charset=utf-8');

if (!isset($_POST['pdfData'])) {
    die("未接收到PDF数据");
}

$base64Str = $_POST['pdfData'];
// 处理URL安全的Base64（如果前端传递的是替换了+/-的格式）
$base64Str = str_replace(['-', '_'], ['+', '/'], $base64Str);

// 解码Base64
$pdfContent = base64_decode($base64Str);
if ($pdfContent === false) {
    die("Base64解码失败，请检查数据完整性");
}

// 输出PDF供下载
header('Content-Disposition: attachment; filename="final.pdf"');
header('Content-Length: ' . strlen($pdfContent));
echo $pdfContent;
exit;
?>

注意：如果要将PDF保存到服务器而非直接下载，要确保目标目录有写入权限，比如：

$savePath = './saved-pdfs/final.pdf';
// 确保目录存在
if (!is_dir(dirname($savePath))) {
    mkdir(dirname($savePath), 0755, true);
}
if (file_put_contents($savePath, $pdfContent)) {
    echo "PDF已保存到服务器";
} else {
    die("无法写入PDF文件，请检查目录权限");
}

• 检查浏览器Network面板：查看POST请求的Form Data，确认pdfData参数是完整的纯Base64字符串，没有被截断或转义；
• 测试Base64解码：把前端传递的Base64字符串复制到在线Base64解码工具，看看是否能还原出正常的PDF内容，以此区分是前端传递问题还是后端解码问题。

你可以按照这个顺序一步步排查，先锁定问题出在前端生成、数据传递还是后端处理，应该能快速解决空白PDF的问题。

内容的提问来源于stack exchange，提问作者Nitin Bhat