Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Дать браузеру понять,что изображение нужно скачать (https://javascript.ru/forum/css-html/74692-dat-brauzeru-ponyat-chto-izobrazhenie-nuzhno-skachat.html)

terminator1998 31.07.2018 22:47

Дать браузеру понять,что изображение нужно скачать
 
Я хочу,чтобы при переходе в ту вкладку,изображение скачивалось на компьютер,точнее бразеру давало понять,что изображение нужно не смотреть,а скачать
Вот код,которым я пытался это сделать:
location.href="http://habrastorage.org/storage1/cf1a57bd/e7cc2b34/b9d6fc1d/0a19729c.jpg"


Ну как мы видем при переходе,оно само не начинает скачиваться,а нужно нажимать ПКМ => Сохранить изображение как

P.S Если что имеется JQuery,но это я так,вдруг пригодится

j0hnik 31.07.2018 23:20

<canvas id="demo" width="500" height="400"></canvas>

	<script>
var ctx = demo.getContext('2d'),
    w = demo.width,
    h = demo.height,
    img = new Image();

img.onload = function() {

    ctx.drawImage(img, 0, 0, w, h);
    download(demo, 'test.png');
    
}

img.crossOrigin = 'anonymous';
img.src = 'http://i.imgur.com/bbQ7uxV.jpg';

/// download canvas as image
function download(canvas, filename) {
    
    if (typeof filename !== 'string' || filename.trim().length === 0)
        filename = 'Untitled';
    
    var lnk = document.createElement('a'),
        e;
    
    lnk.download = filename;		
    lnk.href = canvas.toDataURL();	
    
    if (document.createEvent) {
        
        e = document.createEvent("MouseEvents");
        e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
        
        lnk.dispatchEvent(e);
        
    } else if (lnk.fireEvent) {
        
        lnk.fireEvent("onclick");
    }
}

	</script>


5 минут гугла и можно найти множество решений. canvas, base64

Белый шум 01.08.2018 01:03

Если картинка лежит на том же сайте (same-origin), то можно атрибутом download:
<a href="/forum/images/ca_serenity/misc/logo.gif" download="filename.jpg">скачать</a>

Поддержка хорошая, но не идеальная: https://caniuse.com/#feat=download

Rise 01.08.2018 10:00

j0hnik,
так не получится, если картинка с другого сайта.

Белый шум 01.08.2018 14:08

Цитата:

Сообщение от Rise (Сообщение 491442)
j0hnik,
так не получится, если картинка с другого сайта.

Да вроде сохранило у меня...

Rise 01.08.2018 14:22

Белый шум,
получится если есть заголовки доступа, ну как у кросс-доменного ajax.

Alexandroppolus 01.08.2018 15:25

если в заголовке ответа у кроссдоменной картинки нет подходящего "Access-Control-Allow-Origin", то без помощи своего сервера никак не обойтись. Ну а в таком случае и канва не понадобится, сразу напрямую атрибут download


Часовой пояс GMT +3, время: 04:26.