Question

我正在开发一个包含画布的程序，但我希望将画布另存为.jpg文件而不是data：image / jpeg dfkasd; flaehfoewhfer。用户的目标是将一个.png文件的位置拖动到另一个文件上方，然后将其翻译为画布，然后将其另存为.jpg文件，以便可以将其放入我的MySQL数据库中。有没有办法做到这一点？这是我的JavaScript所拥有的：

function translateTo() {
        var c = document.getElementById("myCanvas");
        var ctx = c.getContext("2d");
        var watermark = document.getElementById("watermark");
        watermark.style.opacity = "0.3";
        var top = document.getElementById("show-wm").offsetTop;
        var right = document.getElementById("show-wm").offsetLeft;
        var width = document.getElementById("show-wm").width;
        var height = document.getElementById("show-wm").height;
        ctx.globalAlpha = 0.4;
        ctx.drawImage(watermark, right, top, width, height);
        document.getElementById("url").value = c.toDataURL("image/jpeg", 1.0);
        document.getElementById("watermark-form").submit();
    }

HTML：

    <form action="" method="post" id="watermark-form">
        <input type="hidden" name="image" value="<?php echo $photo_id; ?>">
        <input type="hidden" name="url" value="" id="url">
        <input type="hidden" name="oldpath" value="<?php echo $photo_url; ?>">
    </form>
    <div class="draggable">
        <img id="show-photo" src="https://theexplorerblog.com/images/<?php echo $img; ?>">
        <img id="show-wm" width="220px" src="wide-logo.png" alt="Your Photo">
        <a class="button" href="javascript:translateTo()">Finish</a>
    </div>
<div class="hi">
    <img id="photo" src="https://theexplorerblog.com/images/<?php echo $img; ?>">
    <img id="watermark" width="220px" src="wide-logo.png" alt="Watermark">
</div>
<canvas id="myCanvas" style="border:1px solid #d3d3d3;">
    Your browser does not support the HTML5 canvas tag, so we are unable to make your watermarked photo.
</canvas>

和PHP形式（我之前定义了连接）：

<?php
    if(isset($_POST['url'])){
        $image_id = mysqli_real_escape_string($connection,$_POST['image']);
        $url = $_POST['url'];
        $photourl = mysqli_real_escape_string($connection,$_POST['oldpath']);
        $query = "UPDATE photos SET photo_url='$url',photo_no_wm='$photourl' WHERE id='$image_id'";
        $result = mysqli_query($connection,$query);
        if($result){
            header("location: submitphoto.php?wm=true");
        }
    }
    ?>

运行此命令时，它会变成一个太长的data：image / jpeg文件。我想将其缩写为.jpg。

有没有一种方法可以将data：image URI转换为.jpg文件而无需下载？

0 个答案: