Как скачивать изображения с других сайтов?

Question

[Valeriy1997]

Есть ли решение загрузки изображений из веб ресурсов по url, и их дальнейшего сохранения. Суть в том , чтоб изображения сохранялись на клиенте.

Comments

[Павел Кононенко]

Есть ли решение для вытягивания изображений и их дальнейшего сохранения на нам клиенте

Суть в том , чтоб изображения сохранялись не на клиенте

Вам что надо?

[Valeriy1997]

Извините опечатка( Сохранить на клиенте

[АртемЪ]

Что значит вытягивание изображений? Опишите подробнее задачу, для чего это нужно?

Answer 1

[mr-molodoy]

под "на клиенте" Вы подразумеваете браузер?

Вроде бы как политика безопасности браузеров на сегодняшний день не позволит даже сделать кроссдоменный запрос и получить изображения, без специального заголовка со стороны сервера который Вы собираетесь "ограбить". Если я не ошибаюсь.

Можно по след. схеме:
Клиент <- Ваш сайта -> Сайт "жертва".

Т.е:

$.post('/getImages.php', {
     url: 'http://site.com/images/image.jpg'
}, function (data) {
    // Сохраняем изображения
    // Правда признаюсь - это извращение ;)
}, 'JSON');

<?php
     $url = $_POST['url'];
     $filename = end('/', $url);
     $path = __DIR__ . '/images_cache/';

     file_put_contents($path . $filename, file_get_contents($url));

     json_encode([
          'image' => '/images_cache/' . $filename,
          'filename' => $filename
     ]);

Comments

[mr-molodoy]

Ах, да. Забыл.
Для непосредственно сохранения единственное, что вижу - это копать в сторону localStorage, но при этом вкладка будет жрать кучу оперативной при этом, после пары тройки фото - не забывайте. Почитайте еще по File API, возможно после получения нужных привилегий будет возможность сохранять картинки прямо в Файловую систему на клиенте. Других вариантов скорее всего нет.

[mr-molodoy]

Либо разумеется написать приложение для взаимодействия с ФС пользователя вне браузера.

[Stalker_RED]

mr-molodoy: Вы усложняете, IMHO. Если всё происходит в браузере, то зачем вам ajax с его ограничениями, если картинку можно получить при помощи <img src="">

[Павел Волынцев]

Клиент <- Ваш сайта -> Сайт "жертва"
Подерживаю. Так работают многие сервисы, в которых вставляешь URL страницы, а они вставляют картинки с этой страницы: facebook, vk, pinterest, google+

[mr-molodoy]

Stalker_RED: Не буду утверждать, т.к не задавался вопросом, однако, сможете ли Вы после этого получить blob этой картинки которая получена таким образом? Ведь задача стоит не отрендерить картинку на странице.
Если это возможно, не могли бы Вы привести пример, мне бы это так же пригодилось бы, как раз в скором времени может очень пригодится, если таким способом это возможно, то разумеется я солидарен, так гораздо удобнее.

[Stalker_RED]

mr-molodoy: Через canvas.toDataUrl(), например.

[mr-molodoy]

Наверняка Вы имели ввиду:
canvas.drawImage() и после canvas.toDataUrl().
Впрочем, думаю если покопаться, то что-то можно из этого на шаманить.
Спасибо за наводку.

Answer 2

[Сергей]

По-моему вам нужен XMLHttpRequest + FileSystem API

var fs = null;
window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(window.PERSISTENT, 2*1024*1024, function(f) {
    f = fs; 
    download(fs, "http://yourdomain.com/example.gif","example.gif",function(){/*success*/},function(){/*fail*/});
});

function download(fs,url,file,win,fail) {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url);
  xhr.responseType = "blob";
  xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
      if(xhr.status === 200){
        fs.root.getFile(file,{create:true},function(fileEntry){
          fileEntry.createWriter(function(writer){
            writer.onwriteend = win;
            writer.onerror = fail;
            writer.write(xhr.response);
          })
        },fail)
      } else {
        fail(xhr.status);
      }
    }
  };
  xhr.send();
  return xhr;
};

Comments

[mr-molodoy]

Через XMLHttpRequest не получится если сервер не передаст заголовок
Origin: example.com
где, example.com - это домен с которого делается запрос на получение картинки и как Вы понимаете такой заголовок владелец, сайта жертвы устанавливать не будет.
Думаю, что развивать тему в сторону, социальной инженерии так же не стоит и переводить разговор в русло "как убедить владельца сайта установить заголовок xxxx: yyyyy;"

[Сергей]

mr-molodoy: проще пользователя уговорить установить что-то вроде https://chrome.google.com/webstore/detail/allow-co...

[mr-molodoy]

Возможно, но согласитесь - это уже костыль. Раз уж мы уговариваем пользователя что-то установить. Почему бы не написать полноценное приложение которые бы сохраняло картинки в ФС клиентского компьютера "по человечески" и без "костылей" и не попросить его установить написанное приложение?

Answer 3

[Dmitriy Mozgovoy]

Можно покопать в сторону загрузки изображения по url в canvas, потом использовать toDataURL чтобы получить файл в base64, потом уже его сохранить через File API