javascript - PHP 屏幕截图 - 按钮

Question

我有一个保存屏幕截图的按钮，但不幸的是，当您单击时什么也没有发生

JavaScript

function take_screenshot() {
    html2canvas(document.body, {
        onrendered: function(canvas) {
            var img = canvas.toDataURL()
            $.post("save_screenshot.php", {data: img}, function (file) {
                window.location.href =  "save_screenshot.php?file="+ file
            });
        }
    });
}

PHP

<?php
if($_GET['file']) {
    $file=$_GET['file'];
    if (file_exists($file)) {
        header('Content-Description: File Transfer');
        header('Content-Type: image/png');
        header('Content-Disposition: attachment; filename='.basename($file));
        header('Content-Transfer-Encoding: binary');
        header('Expires: 0');
        header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
        header('Pragma: public');
        header('Content-Length: ' . filesize($file));
        ob_clean();
        flush();
        readfile($file);
        unlink($file);
        exit;
    }
}

if($_POST['data']) {
    $data = $_POST['data'];
    $file = md5(uniqid()) . '.png';
    $uri =  substr($data,strpos($data,",")+1);
    file_put_contents('./'.$file, base64_decode($uri));
    echo $file;
    exit();
}

我想要将屏幕保存为 png 并选择位置。我使用了互联网上的指南，在我看来它应该有效

Answer 1

您需要拆分dataUrl，因为它是由,分隔的

function take_screenshot() {
    html2canvas(document.body, {
        onrendered: function(canvas) {
            var img = canvas.toDataURL()
            $.post("save_screenshot.php", {data: img.split(',').pop()}, function (file) {
                window.location.href =  "save_screenshot.php?file="+ file
            });
        }
    });
}