使用“打开方式”命名从Canvas保存的PNG文件。对话

本文介绍了使用“打开方式”命名从Canvas保存的PNG文件。对话的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我使用canvas，我可以将我的画布保存到png。

通过环顾四周，我发现了伟大的toDataURL W3C。

我也使用了nihilogic的canvas2image，我们可以在这个页面找到：www.nihilogic.dk/labs/canvas2image/

我注意到在canvas2image，开发人员使用图像/ octet-stream打开打开方式对话框，但是提供一些问题：

-picture名称是由toDataUrl（）返回的ascii。

下载时，文件扩展名为.part

总之，我会提示打开方式对话框myImage.png。

有可能吗？任何帮助将不胜感激。

编辑：我有约束只能使用Javascript，我不能使用一些不错的PHP技巧

解决方案

如果你的目标只有现代浏览器，不关心跨浏览器这么多，有一个可能的解决方案与下载的元素属性。 以下是您的信息示例：

< a target =_ blankhref =https：// www.google/intl/en_com/images/srpr/logo3w.pngdownload =testXXX.jpg>下载我！< / a>

只有一行，没有javascript，是啊！您可以将href部分更改为数据网址，也可以使用。

检查此关于html5rocks的Eric的教程，了解更多详情。

I am working with canvas and I would be able to save my Canvas to png.

By looking around, I discover the great toDataURL() function given by the W3C.

I am also already using the canvas2image from nihilogic that we can found on this page : www.nihilogic.dk/labs/canvas2image/

I noticed that on canvas2image, the developpers use the "image/octet-stream" which open the "open with" dialog box but give some problem :

-picture name is the ascii returned by toDataUrl().

-file extension is .part when downloaded

In short, I would prompt the "open with" dialog box with something like "myImage.png" when clicking on a button.

Is it possible ? Any help would be appreciated.

Edit : I have the contraint to use only Javascript, I can't use some nice PHP trick

解决方案

if you aim to only modern browsers and don't care cross-browser that much, there's a possible solution with "download" attribute of element. Here's one sample for your information:

<a target="_blank" href="www.google/intl/en_com/images/srpr/logo3w.png" download="testXXX.jpg">DOWNLOAD ME!</a>

Only one line, no javascript, yeah! You can change the href part into data url, and that works too.

Check this Eric's tutorial on html5rocks for more details.