无法从chrome中获取Canvas toDataUrl的完整图像文件

Question

我正在尝试通过php文件从服务器下载图像文件（如另存为）。点击我的html页面中的“保存按钮”，我使用canvas'toDataUrl并将其发送到php文件。我可以在FF＆amp;中正确保存完整的图像。歌剧但不是铬。在chrome中，只有一半的图像被保存。

HTML代码

<form id="frm" method="post" action="php/saveimg.php" style="display:none">
<input type="submit"  value="submit"/>
<input type="text" name="data" id="data" />
</form>

JS代码：

$("#saveimg").click(function(){

    var dataurl=document.getElementById('mycanvas').toDataURL();
    $("#data").val(dataurl);
    $("#frm").trigger("submit");
});

PHP代码（saveimage.php）：

<?php
$data = $_POST['data'];
//removing the "data:image/png;base64," part
$uri =  substr($data,strpos($data,",")+1);
file_put_contents('wow.png', base64_decode($uri));
if(file_exists('wow.png')){
    header("Content-Type: application/force-download");
    header('Content-Disposition: attachment; filename="wow.png"');
    readfile('wow.png');
 }
 ?>

如果我在这里做错了，请告诉我。