使用canvas.blob函数面临一些问题

Question

我最近开始使用Javascript，现在我面临着问题

canvas.toBlob(),

每当我运行此功能时，我的画布图像都会下载到我的下载文件夹中。 无论如何，我可以在项目文件夹中下载画布图像，这样如果我必须获取它来显示，那就很容易了。

 canvas.toBlob(function(blob) {
  saveAs(blob, 'mypng.png');
});

Answer 1

JavaScript 中的 canvas.toBlob() 函数用于将 HTML5 canvas 元素的内容转换为 Blob 对象，然后将其保存为文件。默认情况下，当您使用 canvas.toBlob() 时，Blob 将作为下载保存在用户浏览器中，通常保存在“下载”文件夹中。

如果要将 Blob 保存到项目文件夹中的特定位置，则无法直接控制它在用户系统上保存的文件路径。但是，如果您的项目有服务器端组件，您可以控制将其保存在服务器上的位置。

以下是如何实现此目的的基本概述：

1. 设置服务器：如果您的项目有服务器组件（例如 Node.js、Python、PHP 等），您可以将 Blob 数据发送到您的 服务器，然后将其保存到服务器上的特定文件夹中。
2. 使用服务器端语言来处理 Blob： 在您的服务器上，您可以使用服务器端语言来处理 Blob 并将其保存到 您在项目目录中选择的位置。最正确 代码将取决于您使用的服务器端语言。
3. 提供下载链接：将 Blob 保存到您的服务器上后，您可以提供链接或 API 以从中下载图像 项目文件夹中的位置。

请记住，这种方法需要服务器端组件，因此 您需要设置一台服务器才能使其工作。如果你是 处理仅限客户端的项目（例如静态网站），您不会 能够直接控制用户的下载位置 机器。