Question

从JS开始并不是我的优势之一。在过去的几天里，我一直在尝试编辑这个JS函数，以强制下载base64图像。单击下载按钮时，该功能的作用是打开一个新窗口，上面有图像。然后用户必须右键单击并保存图片。我正试图强制下载图像而不是右键单击并“另存为”。

dataurl生成base4 png字符串（数据：image / jpeg; base64，/ 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wBDAAEBAQEBAQEBAQ .........）

我尝试使用，因为它是在另一个线程中建议但是没有用。

欢迎所有建议。感谢。

savePaint: function() {
            var self = this;

            dataURL = self.context.canvas.toDataURL();

            var cntnt = $("<p class='dialogHeader'>Please right click and select 'Save Image As' option. Click here to Return</p>           <img id='PrintImage' src=" + dataURL + ">");
            self.newSavedImage.html(cntnt);

            self.showPopup(self.newSavedImage, self.canvasWidth, self.canvasHeight)
}

Answer 1

最后！我得到了它的工作。对于遇到相同问题的任何人，我在http://danml.com/download.html找到了一个函数，可以强制下载base64。

Answer 2

您可以尝试以下操作：（您可以看到代码有效 here）
javascript文件：

var valuToDecode = document.getElementById("base64-image-string").value;
var linkImg = valuToDecode.concat('" alt="Red dot" download="ganixo-file.png"> click here to download your img </a>');
document.getElementById("codedImg").innerHTML=  '<a href="data:image/jpeg;base64,'.concat(linkImg);

html文件：

Image url:<p  id="codedImg"></p>

输出：

<p id="codeImg"><a href="data:image/jpeg;base64,iVB..." download="img.png">click here to download your img</a></p>

Answer 3

您可以指定不同的MIME类型而不是image / jpeg，以便浏览器不会尝试本机打开图像：

data:application/octet-stream;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/...

这将强制文件下载，但我注意到在某些浏览器配置中可能会使用默认文件名自动保存，并且由于浏览器不知道真实文件类型，因此用户需要指定正确的类型。不幸的是，数据URI方案不允许建议的文件名。

查看Using HTML5/Javascript to generate and save a file以获取更多可能的解决方案。根据您的要求，您最好的选择可能是采用基于Flash的解决方案，例如Downloadify。

强制下载base64图像

3 个答案: