атрибут загрузки для href не работает для png - PullRequest
0 голосов
/ 31 октября 2018

Я использую атрибут download href, чтобы заставить браузер загружать файлы. Это работает, но в случае png это не так:

<a class="esdc-AnchorBtn save" title="Download the image file in PNG format" href="http://csaint.esac.esa.int/ftp_public/jcook022221192/CSA_CG_PREGEN_6HOUR_jcook02_20181031_154434__20060111000000.png" download=""></a>

Изображение отображается в текущем окне браузера или на новой вкладке, если я добавлю target = "_ blank".

Полагаю, это происходит потому, что возвращаемый тип контента "image / png"

Есть ли способ заставить браузер сохранить изображение.

Спасибо

1 Ответ

0 голосов
/ 31 октября 2018

Есть несколько вещей, которые могут происходить.

Но сначала атрибут download работает только в следующих условиях ;

Этот атрибут работает только для URL того же происхождения. (например: страница со ссылкой должна находиться в домене csaint.esac.esa.int, так как именно на нее указывает ссылка.)

Несмотря на то, что URL-адреса HTTP (s) должны быть одного происхождения, blob: URL-адреса и data: URL-адреса разрешены, чтобы можно было загружать содержимое, сгенерированное JavaScript, например изображения, созданные в веб-приложении для редактирования изображений. (В вашем случае ваша страница HTTPS?)

Если заголовок HTTP Content-Disposition: дает другое имя файла, чем этот атрибут, заголовок HTTP имеет приоритет над этим атрибутом.

Если для Content-Disposition: установлено значение inline, Firefox отдает приоритет Content-Disposition, как регистр имени файла, в то время как Chrome устанавливает приоритет для атрибута загрузки.

С точки зрения вашего синтаксиса, если вы не хотите менять имя файла, оно должно выглядеть так:

<a [...] href='example.com/image.jpg' download></a>

Если вы хотите изменить имя файла, тогда вам следует установить для атрибута значение.

<a [...] href='example.com/image.jpg' download='myImage.jpg'></a>

Когда дело доходит до доступности браузера, это довольно хорошо. Однако есть такие, которые не поддерживают его, например, IE. Вы можете посмотреть на детали здесь: https://caniuse.com/#feat=download caniuse graph

...