如何将画布保存为图像而不是直接下载？

【问题标题】：How can I save the canvas as an image instead of downloading it directly?如何将画布保存为图像而不是直接下载？
【发布时间】：2021-08-20 22:24:39
【问题描述】：

我有一个 p5 游戏，我想将画布保存为 p5.Image，以便稍后在画布上显示它。但是我只找到了直接下载画布图像的saveCanvas() 函数。有没有办法将其保存为图像以备后用？

【问题讨论】：

标签： javascript image canvas save

【解决方案1】：

AFAIK p5.js 库没有提供执行此操作的方法。但是，您可以通过以下代码将其转换为数据 url：

const dataURL = document.querySelector("#myCanvas")
                        .toDataURL()
                        .replace("image/png", "image/octet-stream");

然后您可以将其用作常规图像源，例如您可以将当前页面重定向到图像：

window.location.href = dataURL;

【讨论】：