Назовите файл PNG, сохраненный из Canvas, используя диалог «Открыть с помощью»

Question

Я работаю с canvas и могу сохранить Canvas в png.

Осмотревшись, я обнаружил замечательную функцию toDataURL (), предоставляемую W3C.

IЯ также уже использую canvas2image из nihilogic, который мы можем найти на этой странице: http://www.nihilogic.dk/labs/canvas2image/

Я заметил, что на canvas2image разработчики используют «image / octet-stream», который открывает диалог «Открыть с помощью»но у меня возникли некоторые проблемы:

-picture name - это ascii, возвращаемое toDataUrl ().

-file расширение - .part при загрузке

Короче, я бы предложилдиалоговое окно «Открыть с помощью» с чем-то вроде «myImage.png» при нажатии на кнопку.

Возможно ли это?Буду признателен за любую помощь.

Редактировать: у меня есть ограничение на использование только Javascript, я не могу использовать какой-то хороший трюк PHP

Answer 1

если вы нацелены только на современные браузеры и не заботитесь о кросс-браузерности, есть возможное решение с атрибутом «download» элемента. Вот один пример для вашей информации:

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

Только одна строка, без JavaScript, да! Вы можете изменить часть href на url данных, и это тоже работает.

Проверьте это Учебник Эрика на html5rocks для получения более подробной информации.

Answer 2

К сожалению нет. В настоящее время data URI (используемые этим модулем canvas2image; на самом деле довольно аккуратно) не поддерживают указание заголовков имени файла или расположения содержимого, поэтому единственный способ заставить браузер сгенерировать диалоговое окно сохранения как - установите тип контента в поток октетов.

Answer 3

Что ж, в реальных веб-приложениях решение Hangrui Gao далеко не приемлемо, в соответствии с

http://caniuse.com/#feat=download

вы запретите эту функцию всем IE, Safari, IOS Safari, пользователи Android.

Я думаю, что с учетом этого ограничения в Canvas2Image, лучшим решением будет использование некоторой серверной логики, как объяснено здесь

Linuxatico