Question

好的，所以，我有一个MVC应用程序，我正在创建一个画布图像，并通过执行canvas.toDataURL（“image / png”）获取数据URL。我想要做的是将其保存到用户的文件系统中。

我尝试使用javascript执行此操作：

var saveUrl = canvas.toDataURL("image/png");
saveUrl = saveUrl.replace("image/png", "application/octet");
window.open(saveUrl);

但是这只是给了我一个名为download的文件，没有任何扩展名或任何内容。我想获取保存对话框并为文件提供类型和名称，并将其保存到用户的光盘中。

所以我想我可以将数据发布到服务器，然后用响应头做一些事情告诉浏览器我正在尝试为它保存图像，但我找不到一个好方法这个。我正在使用ASP.NET MVC。有没有人有一个很好的方法让我这样做？

Answer 1

这是我最终的结果：

发布图片：

[HttpPost]
public void PostImageForPrinting(string dataUrl)
{
    SomePersistentObject.CurrentDataURL = dataUrl;
}

服务形象：

public ActionResult PrintMission()
{
    var url =
            SomePersistentObject.CurrentDataURL.Substring(SomePersistentObject.CurrentDataURL.IndexOf(",") + 1);
    var image = Convert.FromBase64String(url);
    return base.File(image, "image/png", "mission.png");
}

客户方：

var saveUrl = canvas.toDataURL("image/png");
var jsonString = JSON.stringify({ dataUrl: saveUrl });
$.ajax({
    url: "/Home/PostImageForPrinting",
    contentType: "application/json",
    type: "POST",
    data: jsonString,
    success: function (result) {
        window.location.href = "/Home/PrintMission";
    }
});

将canvas dataurl保存到用户的文件系统

1 个答案: