如何将画布另存为 .png? (在 Laravel 中)

时间:2021-01-08 16:40:12

标签: javascript ajax laravel

我是编码新手,我想在单击保存按钮时将画布另存为 .png

 <script>
    function save(){
    var canvas=$('#myCanvas');

    var blank = document.createElement('canvas');
    blank.width = canvas.width;
    blank.height = canvas.height;

    if (canvas.toDataURL()!=blank.toDataURL()){
        var dataURL=canvas.toDataURL('image/png');
        document.form.dataURL.value=dataURL;
        document.form.savei.href=dataURL;
}
</script>

表格

<form class="valign-middle" name="form" id="form">

<button class="btn" onclick="clear();return false;"></button>
<button class="btn" onclick="save();return false;"></button>
<i class="fa fa-paint-brush"></i> <input class="valign-middle" type="range" name="pw" min="1" max="10" value="2" onchange="$('#pb').css({width:this.value+'px',height:this.value+'px'});">
<span class="inline-block padding-s valign-middle border">
        <div class="bg-black" id="pb" style="width:2px;height:2px;"></div>
</span>
<input class="valign-middle" type="color" name="pc" value="#000000">
<input class="width-max valign-middle" type="text" name="url">

<input name="order">
<input name="dataURL"><a name="savei" id="savei" href="" download="canvas.png">Save Canvas</a>

执行后,<input name="dataURL">返回值data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABRgAAAKZCAYAAADTU0fuAAAgAElEQVR4XuzdfbCsd0Ef8K837yQQEsAIakAQRCqUCtYWBjOpNTJUnZEi.........,这么长,但是当我粘贴url时,效果很好

问题是 <a name="savei" id="savei" href="" download="canvas.png">Save Canvas</a> return href http://localhost:8000/notes/edit?pw=2&pc=%23000000&url=http%3A%2F%2Flocalhost%3A8000%2Fnotes%2Fedit%3F&order=&dataURL=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhEUgAABRgAAAKZCAYAAADTU0fuAAAgAElEQVR4XuzdfbCsd0Ef8K837yQQEsAIakAQRCqUCtYWBjOpNTJUnZEiLx1KW61OUWJtUUBxpp2%2BYW2hiMYWUSuVqqW26B9aio4tIMgUi6i1OooUzDQNhAiBhLyHzq8%2Bpx4v9%2B7Z8%2Bw5e767%2Bzkzdy6Yffk%2Bn%2B8Tzjlfd%2Ff5jPgiQIAAAQIECBAgQIAAAQIECBAgQIDATIHPmHk%2FdyNAgAABAgQIECBAgAABAgQIECBAgEAMjE4CAgQIECBAgAABAgQIE...

并且此网址显示 Request-URI Too Long. The requested URL's length exceeds the capacity limit for this server. 我不知道为什么他们得到不同的结果,有什么帮助吗?

0 个答案:

没有答案
相关问题