如何切割画布数据URI链接

How to cut canvas Data URI links?

本文关键字：数据 URI 链接 何切割 布数据      更新时间：2023-09-26

是否有办法从画布toDataUrl方法中剪切链接?或者其他保存画布图像的方法?

无论你想做什么，你都应该使用合适的术语，因为我不知道"cut links"是什么意思，但这里有一些猜测…

创建指向图片的链接 

var datauri = document.getElementById("myCanvas").toDataURL();
var link = document.createElement("a");
link.innerHTML = "Download image";
link.setAttribute("href", datauri);
document.body.appendChild(link);

在新选项卡中打开图像

var datauri = document.getElementById("myCanvas").toDataURL();
window.open(datauri, "_blank");

奖金…这些需要PHP，并使用我编写的库EasyImage

下载图片到用户电脑

在服务器上创建这个PHP文件，命名为downloader.php:

<?php
require "EasyImage.php";
EasyImage::Create($_POST['img'])->download("yourImage.png");

然后将dataURI发送到PHP脚本，它将强制下载到用户的计算机

<form href="downloader.php" method="POST" id="dlform"><input type="hidden" id="img" name="img"></form>
<script>
function downloadImage(){
    var datauri = document.getElementById("myCanvas").toDataURL();
    document.getElementById("img").value = datauri;
    document.getElementById("dlform").submit();
}
</script>

然后调用downloadImage()下载图像

如果您想将图像保存到服务器，您可以将->download("yourImage.png");替换为->save("yourImage.png");

在未来你需要更多，更多更具体，这样人们就不用猜测了，因为大多数人不会猜测，他们会直接进入下一个问题。

相关文章：