kat*_*003 4 javascript php dompdf
我正在使用Thomas J Bradley的插件在html表单的底部绘制两个签名,然后使用dompdf将其转换为pdf,并使用sendmail通过电子邮件作为附件发送.
一切都运行良好,除了我似乎无法将签名重绘到pdf文件而不将它们保存到磁盘,我想避免.
Bradley先生提供了几种重新生成签名的方法,但我需要一些关于如何将签名数据与表单值一起传递给pdf转换器的建议,最好是"即时"(不将数据保存到磁盘或数据库).
我很感激任何答案.如果您需要任何示例代码,请告诉我.
先感谢您!
您应该捕获签名图像,而不是重新生成签名.签名板可以将签名作为编码为数据URI 的图像返回.dompdf了解数据URI,因此您可以使用它来生成PDF.如果您的目标是不支持该方法的平台,则作者可以使用大量选项来转换签名服务器端.
简而言之,该过程是捕获表单提交时的图像输出,将其传递给服务器,并使用PDF生成签名动态填充HTML.无需保存图像.
我没有使用过Signature Pad,所以我使用作者的HTML模板作为示例代码的基础.
客户端
<form method="post" action="" class="sigPad">
<label for="name">Print your name</label>
<input type="text" name="name" id="name" class="name">
<p class="typeItDesc">Review your signature</p>
<p class="drawItDesc">Draw your signature</p>
<ul class="sigNav">
<li class="typeIt"><a href="#type-it" class="current">Type It</a></li>
<li class="drawIt"><a href="#draw-it">Draw It</a></li>
<li class="clearButton"><a href="#clear">Clear</a></li>
</ul>
<div class="sig sigWrapper">
<div class="typed"></div>
<canvas class="pad" width="198" height="55"></canvas>
<input type="hidden" name="output" class="output">
<input type="hidden" name="imgOutput" class="imgOutput">
</div>
<button type="submit">I accept the terms of this agreement.</button>
</form>
<script>
var sig;
$( document ).ready( function ( ) {
sig = $('.sigPad').signaturePad();
} );
$( '.sigPad' ).submit( function ( evt ) {
$( '.imgOutput' ).val( sig.getSignatureImage( ) );
} );
</script>
服务器端
<?php
$img_output = $_POST['imgOutput'];
if ( base64_encode( base64_decode( $img_output ) ) === $img_output ) {
require_oncde 'dompdf_config.inc.php';
$html = '<p>Your Signature:</p><p><img src="' . $img_output . '"></p>';
$dompdf = new DOMPDF;
$dompdf->load_html( $html );
$dompdf->render( );
$dompdf->stream( );
} else {
// exception logic ... "your signature was not valid"
}
?>
将签名图像简单验证为有效的base64,如何检查字符串是否为base64有效
布莱恩，你太棒了！我必须执行以下操作才能使其正常工作，因为我们正在检查包含的这一行data:image/png;base64,。
但在你的帮助和一些挖掘下，我获得了一个带有签名的 pdf :) 这是代码，以防将来有人需要它。
html部分：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="jquery.signaturepad.css" media="screen">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.signaturepad.min.js"></script>
</head>
<body>
<form method="post" action="pdf.php" class="sigPad">
<label for="name">Print your name</label>
<input type="text" name="name" id="name" class="name">
<p class="drawItDesc">Draw your signature</p>
<ul class="sigNav">
<li class="drawIt"><a href="#draw-it">Draw It</a></li>
<li class="clearButton"><a href="#clear">Clear</a></li>
</ul>
<div class="sig sigWrapper">
<canvas class="pad" width="198" height="55"></canvas>
<input type="hidden" name="imgOutput" class="imgOutput">
</div>
<button type="submit">I accept the terms of this agreement.</button>
</form>
<script>
var sig;
$(document).ready(function() {
/*sig = $('.sigPad').signaturePad();*/
sig = $('.sigPad').signaturePad({drawOnly:true});
});
$('.sigPad').submit(function(evt) {
$('.imgOutput').val( sig.getSignatureImage() );
});
</script>
</body>
</html>
pdf.php：
<?php
if(isset($_POST['imgOutput'])){$img_output = $_POST['imgOutput'];}
$bse = preg_replace('#^data:image/[^;]+;base64,#', '', $img_output );
if ( base64_encode( base64_decode($bse) ) === $bse ) {
require_once 'dompdf/dompdf_config.inc.php';
$html = '<!DOCTYPE html><html><head></head><body><p>Your signature:</p>
<br />
<img src="'. $img_output .'"></body></html>';
$dompdf = new DOMPDF;
$dompdf->load_html($html);
$dompdf->render();
$dompdf->stream("test.pdf");
}
else {
echo ("ERROR !");
}
?>
非常感谢@Thomas J Bradley、dompdf 团队和@BrianS拯救了这一天。
| 归档时间： |
|
| 查看次数： |
5136 次 |
| 最近记录： |