在web应用开发中,有时我们需要在客户端生成pdf文档,并将其作为附件通过电子邮件发送。直接在客户端发送邮件存在安全和功能限制,因此通常的做法是将生成的pdf数据发送到服务器,再由服务器端的邮件服务(如phpmailer)进行发送。本文将详细介绍如何结合html2pdf.js、ajax和phpmailer实现这一功能。
客户端的核心任务是将HTML内容转换为PDF,并以可传输的格式(通常是Base64编码字符串)获取PDF数据。html2pdf.js库提供了outputPdf('datauristring')方法来获取这种格式的数据。
首先,确保你的HTML页面中有一个用于生成PDF的元素,例如一个div。
<div id="printPage"> <!-- 这里是你要转换为PDF的内容 --> <h1>PDF 文档标题</h1> <p>这是一段示例文本,将被包含在生成的PDF中。</p> @@##@@ </div> <button id="sendPdfBtn">发送PDF邮件</button>
接下来,在JavaScript中配置html2pdf并获取PDF内容:
立即学习“PHP免费学习笔记(深入)”;
// 假设你的HTML中有一个ID为'printPage'的元素,这是要转换为PDF的内容源 let page = document.getElementById('printPage'); // html2pdf的配置选项 var options = { margin: [5, 0, 0, 0], // 上右下左边距 filename: 'document.pdf', // 默认文件名,在服务器端可覆盖 image: { type: 'jpeg', quality: 1 // 图像质量 }, pagebreak: { mode: ['legacy'] // 分页模式 }, html2canvas: { scale: 3 // html2canvas渲染比例,影响清晰度 }, jsPDF: { unit: 'mm', // 单位 format: 'a4', // 纸张格式 orientation: 'portrait' // 方向:纵向 } }; // 监听按钮点击事件,触发PDF生成和发送 $(document).on('click', '#sendPdfBtn', async function() { let pdfContent; try { // 使用await等待PDF内容生成,并以datauristring格式获取 // datauristring格式包含 "data:application/pdf;base64," 前缀 pdfContent = await html2pdf().from(page).set(options).outputPdf('datauristring'); // 成功获取PDF内容后,通过Ajax发送到服务器 sendPdfToServer(pdfContent); } catch (error) { console.error("PDF生成失败:", error); alert("PDF生成失败,请稍后再试。"); } }); // 这是一个示例函数,用于将PDF内容发送到服务器 async function sendPdfToServer(pdfData) { // 假设ajaxUrl是你的PHP处理脚本的URL const ajaxUrl = 'your_php_mailer_script.php'; // 其他需要发送的表单数据,例如邮件接收者、主题、消息等 const emailTo = $("#emailTo").val(); // 假设有输入框获取收件人 const emailSubject = $("#emailSubject").val(); // 假设有输入框获取邮件主题 const emailMessage = $("#emailMessage").val(); // 假设有输入框获取邮件内容 $.ajax({ type: "POST", // 使用POST方法发送数据 url: ajaxUrl, data: { action: "sendEmail", // 自定义动作,用于PHP脚本识别 emailTo: emailTo, emailSubject: emailSubject, emailMessage: emailMessage, pdfContent: pdfData // 将Base64编码的PDF内容作为参数发送 }, success: function(response) { console.log("服务器响应:", response); alert("邮件发送成功!"); }, error: function(xhr, status, error) { console.error("Ajax请求失败:", status, error); alert("邮件发送失败,请检查网络或联系管理员。"); } }); }
关键点:
服务器端PHP脚本负责接收客户端发送的Base64编码PDF数据,解码它,然后使用PHPMailer将其作为附件发送。
当客户端通过Ajax发送pdfContent时,PHP可以通过$_POST['pdfContent']来获取它。由于datauristring包含data:application/pdf;base64,前缀,我们需要先去除这个前缀,然后再进行Base64解码。
<?php // 引入PHPMailer类文件 use PHPMailer\PHPMailer\PHPMailer; use PHPMailer\PHPMailer\Exception; require 'path/to/PHPMailer/src/Exception.php'; require 'path/to/PHPMailer/src/PHPMailer.php'; require 'path/to/PHPMailer/src/SMTP.php'; // 确保请求是POST并且包含pdfContent if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['pdfContent'])) { $pdfdoc = $_POST['pdfContent']; // 移除data URI前缀 "data:application/pdf;base64," // strpos(',', $pdfdoc) 找到第一个逗号的位置 $pdfData = substr($pdfdoc, strpos($pdfdoc, ",") + 1); // +1是为了跳过逗号本身 // 对Base64编码的PDF数据进行解码 $decodedPdf = base64_decode($pdfData); // 获取其他邮件信息 $emailTo = $_POST['emailTo'] ?? 'default@example.com'; $emailSubject = $_POST['emailSubject'] ?? '来自网站的PDF附件'; $emailMessage = $_POST['emailMessage'] ?? '请查收附件中的PDF文档。'; // 创建PHPMailer实例 $mail = new PHPMailer(true); // 启用异常处理 try { // 服务器设置 (根据你的SMTP服务商配置) $mail->SMTPDebug = 0; // 启用详细调试输出 (0为关闭,1为客户端,2为客户端和服务器) $mail->isSMTP(); // 使用SMTP $mail->Host = 'smtp.example.com'; // 你的SMTP服务器地址 $mail->SMTPAuth = true; // 启用SMTP认证 $mail->Username = 'your_email@example.com'; // SMTP用户名 $mail->Password = 'your_email_password'; // SMTP密码 $mail->SMTPSecure = PHPMailer::ENCRYPTION_STARTTLS; // 启用TLS加密,或者PHPMailer::ENCRYPTION_SMTPS for SSL $mail->Port = 587; // SMTP端口 (TLS通常是587,SSL通常是465) // 收件人 $mail->setFrom('sender@example.com', '你的公司名称'); // 发件人邮箱和名称 $mail->addAddress($emailTo); // 添加收件人 // $mail->addCC('cc@example.com'); // 添加抄送 // $mail->addBCC('bcc@example.com'); // 添加密送 // 附件 // AddStringAttachment用于添加字符串作为附件 // 第一个参数是附件内容(已解码的二进制数据) // 第二个参数是附件文件名 // 第三个参数是内容的编码类型 (这里是'binary'因为我们已经解码了) // 第四个参数是MIME类型 $mail->AddStringAttachment($decodedPdf, "GeneratedDocument.pdf", "binary", "application/pdf"); // 内容 $mail->isHTML(true); // 邮件内容为HTML格式 $mail->Subject = $emailSubject; // 邮件主题 $mail->Body = $emailMessage; // 邮件HTML内容 $mail->AltBody = strip_tags($emailMessage); // 非HTML邮件客户端的纯文本内容 $mail->send(); echo '邮件已成功发送!'; } catch (Exception $e) { echo "邮件发送失败。 PHPMailer 错误: {$mail->ErrorInfo}"; } } else { echo '无效的请求或缺少PDF内容。'; } ?>
关键点:
通过结合html2pdf.js在客户端生成PDF,利用Ajax将Base64编码的PDF数据传输到服务器,再通过PHPMailer在服务器端解码并发送邮件附件,我们实现了一个完整的客户端PDF生成与服务器端邮件发送的解决方案。这种方法避免了在客户端直接处理邮件发送的复杂性和安全问题,提供了一个健壮且可扩展的实现方案。
以上就是使用html2pdf生成PDF并通过Ajax发送至PHPMailer实现邮件附件功能的详细内容,更多请关注php中文网其它相关文章!
全网最新最细最实用WPS零基础入门到精通全套教程!带你真正掌握WPS办公! 内含Excel基础操作、函数设计、数据透视表等
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号