打印或取消它会给出相同的消息并删除生成的图像

问题描述 投票:0回答:1

在下面的代码中,工作正常,但我面临的唯一问题是,由 html2canvas 生成的文件在取消打印时被删除,这是正确的,但当我使用 Microsoft Print To PDF 打印机成功保存 PDF 文件时,它成功了保存文件但它执行删除文件也不知道为什么以及如何。请帮忙。

无论哪种方式,回应都是:

Response from server: 
success

Deleted generated image: 
success

下面是其余代码:

$("#myButtonS").click(function () {
    var staffno = "<?php echo $staffno; ?>";
    var container = $("#canvasSaveder");
    var charA = $("#charA");
    var horizontalPadding = (container.width() - charA.width()) / 2;
    var verticalMargin = (container.height() - charA.height()) / 2;

    charA.css({
        "color": "black !important",
        "font-weight": "bold",
        "right": "0",
        "left": "0"
    });

    var userCancelledPrint = false; // Define the flag here

    html2canvas(container, {
        scale: 2,
        onrendered: function (canvas) {
            var imgsrc = canvas.toDataURL("image/jpeg", 1);
            $("#newimg").attr('src', imgsrc);
            var dataURL = canvas.toDataURL();

            $.ajax({
                type: "POST",
                url: "save_printed_id.php",
                data: {
                    imgBase64: dataURL,
                    staffid: staffno
                }
            }).done(function (o) {
                console.log('saved');
                printImage(imgsrc);
            });
        }
    });

    function printImage(imgSrc) {
        var staffno = "<?php echo $staffno; ?>";

        var printWindow = window.open('', '', 'width=600,height=600');
        printWindow.document.open();
        printWindow.document.write('<html><body>');
        printWindow.document.write('<div class="pagerA">');
        printWindow.document.write('<img style="margin-top: -8px; margin-left: -8px;" src="' + imgSrc + '" width="105%" />');
        printWindow.document.write('</div>');
        printWindow.document.write('<div class="pagerA">');
        printWindow.document.write('<img src="../../../images/idBacks.jpg" width="100%" />');
        printWindow.document.write('</div>');
        printWindow.document.write('</body></html>');
        printWindow.document.close();

        // Attach an event handler to the print window's beforeunload event
        printWindow.onbeforeunload = function () {
            // Set the userCancelledPrint flag to true when the print window is closed
            userCancelledPrint = true;
        };

        printWindow.print();

        // Close the print window automatically after a delay (e.g., 5 seconds)
        setTimeout(function () {
            printWindow.close();

            // Check if the user canceled the print job and delete the image if needed
            if (userCancelledPrint) {
                deleteGeneratedImage();
            }
        }, 1000); // Adjust the delay as needed

        function deleteGeneratedImage() {
            // Implement code to delete the generated image here
            // For example, you can make an AJAX request to a PHP script that handles the deletion.
            // Ensure you have the necessary logic in place to identify and delete the correct image.
            // Replace the following with your actual delete logic:

            $.ajax({
                type: "POST",
                url: "save_printed_id_cancelled.php",
                data: {
                    staffid: staffno
                }
            }).done(function (response) {
                console.log('Response from server: ' + response);
                if (response.trim() === "success") {
                    console.log('Deleted generated image: ' + response);
                } else {
                    console.log('Failed to delete generated image: ' + response);
                }
            });

        }
    }
});

save_printed_id_cancelled.php

<?php
include ('inc/db.php');

$staffno = mysqli_real_escape_string($dba_si, $_POST['staffid']);
    $sqlIM13    = "select id, filename from id_photos
    where staffno = '$staffno'
    order by id desc
    ";
    $sqlIM14    = $dba_si->query($sqlIM13);
    $sqlIM15    = $sqlIM14->fetch_assoc();
    
    $fileItem5 = 'images/employees/empcards/'.$staffno.'/'.$sqlIM15['filename'];
    //echo $fileItem6 = 'images/employees/empcards/'.$staffno.'/'.$sqlIM15['filename']; // Echo before any deletions

if (unlink($fileItem5)){
    $dba_si->query("delete from id_photos where id = '".$sqlIM15['id']."' ");
    echo "success";
    // Log a message to a file
    error_log("Image deleted successfully for staffno: " . $staffno);
}else{
    echo "Failed to delete generated image: Error - " . error_get_last()['message'];
    // Log an error message to a file
    error_log("Failed to delete image for staffno: " . $staffno);
}

?>
javascript ajax printing html2canvas
1个回答
0
投票

您面临的问题似乎与生成文件的删除顺序有关。根据您的代码实现,当用户取消打印操作以及打印窗口在 1 秒延迟后自动关闭时,文件似乎都被删除。

删除 printImage() 函数内对 deleteGenerateImage() 的调用,因为在这种情况下不应删除文件:

// Remove this part inside the printImage() function
setTimeout(function () {
    printWindow.close();

    // Check if the user cancelled the print job and delete the image if needed
    if (userCancelledPrint) {
        deleteGeneratedImage();
    }
}, 1000); // Adjust the delay as needed

在deleteGenerateImage()函数内,添加一个检查以确定是否应删除或保留文件。此检查应基于 userCancelledPrint 变量。如果用户取消,文件将被删除:

function deleteGeneratedImage() {
    // Check if the user cancelled the print job
    if (userCancelledPrint) {
        // Implement the logic to delete the generated file here
        // For example, you can make an AJAX request to a PHP server to handle the deletion
        $.ajax({
            type: "POST",
            url: "save_printed_id_cancelled.php",
            data: {
                staffid: staffno
            }
        }).done(function (response) {
            console.log('Response from server: ' + response);
            if (response.trim() === "success") {
                console.log('Deleted generated image: ' + response);
            } else {
                console.log('Failed to delete generated image: ' + response);
            }
        });
    }
}

通过这些更改,只有当用户取消打印操作时,生成的文件才会被删除。如果用户使用“Microsoft Print To PDF”成功完成打印操作,则生成的文件将不会被删除。希望这可以帮助你让它发挥作用

© www.soinside.com 2019 - 2024. All rights reserved.