将jsPDF文档发送到服务器

时间:2019-06-26 作者:Paulmcf1987

我一直在尽一切努力寻找解决方案,但似乎没有什么明显的。。。

我创建了一个底部需要签名的表单,并使用html和jQuery创建了完整表单。

我还添加了一些jQuery,可以将html转换为PDF。问题是PDF在客户端浏览器上下载,我需要PDF来找我。

我的整个脚本都是通过jQuery完成的,我正试图找到一个解决方案,以便PDF可以通过电子邮件或直接下载到我选择的文件夹中。

从那以后我一直在尝试。。。

目前,已执行验证,然后我在屏幕上收到通知,通知我表单已提交。

但是,当我查看POD文件夹时,文档不在那里,也不会下载到浏览器。

我的代码中是否有需要更改的内容,以确保它进入正确的文件夹?

N、 B我使用1&;的共享主机包;1个Ionos。我无权访问htdocs下面的任何文件夹,因此我将完整路径放在命令中,并将其路由到我有权访问的文件夹。

jQuery应该验证表单,然后转换为PDF,然后是AJAX请求,该请求应该启动上传。要保存到服务器的php

jQuery(function($){

var $form =  $("form[name=\'pdf-download\']"),
    $successMsg = $(".alert");
    $.validator.addMethod("letters", function(value, element) {
        return this.optional(element) || value == value.match(/^[a-zA-Z\\s]*$/);
    });
    $form.validate({
        rules: {
            firstname: {
                required: true,
                minlength: 3,
                letters: true
            },
            email_id: {
                required: true,
                email: true
            }
        },
        messagess: {
        firstname: "Please specify your name (only letters and spaces are allowed)",
        email_id: "Please specify a valid email address"
        },
        submitHandler: function() {
            $ = jQuery;

            $( "#submit" ).click(function() {
                alert("Submitted");
                make_product_sheet();
            });


            function make_product_sheet() {

                console.log("#submit clicked");
                var pdf = new jsPDF(\'p\', \'pt\', \'a4\');

                pdf.addHTML(document.getElementById("product_sheet"), function() {

                    ps_filename = "generated-product-sheet";
                    var pdf = btoa(doc.output()); 
                        $.ajax({
                        method: "POST",
                        url: "/kunden/homepages/8/d692312546/htdocs/clickandbuilds/Website/wp-content/themes/Theme/POD/upload.php",
                        data: {data: pdf},
                        }).done(function(data){
                        console.log(data);
                        });
                });
            }
        }   
    });

});
上载。php

<?php
if(!empty($_POST[\'data\'])){
$data = base64_decode($_POST[\'data\']);
// print_r($data);
file_put_contents( 
"/kunden/homepages/8/d692312546/htdocs/clickandbuilds/Website/wp-content/themes/Theme/POD/test.pdf", $data );
} else {
echo "No Data Sent";
}
exit();
?>
脚本似乎按预期工作,但是,我找不到最终PDF文档的位置,它不在指定的文件夹中。

如果我改变

ps_filename = "generated-product-sheet";
    var pdf = btoa(doc.output()); 
        $.ajax({
        method: "POST",
        url: "kunden/homepages/8/d692312546/htdocs/clickandbuilds/Website/wp-content/themes/Theme/POD/upload.php",
        data: {data: pdf},
        }).done(function(data){
        console.log(data);
        });

ps_filename = "generated-product-sheet";
pdf.save(ps_filename+\'.pdf\');
然后文件保存到客户端的浏览器中,所以我认为是ajax部分有一个小错误?

使现代化

当我单击提交时,我得到一个未捕获的引用错误no line:671,这是一行:

submitHandler: function() {
        $ = jQuery;
          /*** LINE:671**/ 
        $( "#submit" ).click(function() {
            alert("Submitted");
            make_product_sheet();
        });
但是,提交的消息在提交时会

1 个回复
SO网友:WebElaine

请记住,并不是每个人都在运行JavaScript,所以您确实需要像PHP这样的服务器端表单处理器,而不是仅仅依赖于jQuery。

在WordPress网站上最好的做法是创建一个处理表单的插件。您可以包括像FPDF这样的助手库,这样不仅可以生成PDF,还可以选择将它们保存到服务器,而不仅仅是输出到客户端浏览器。