Загрузить изображение с помощью JavaScript с другого сервера через AJAX

Question

Я пытаюсь (если это возможно) сделать загрузку изображения, хранящегося на другом сайте (а не на компьютере), с помощью JavaScript (разрешено jQuery) с запросом AJAX.

Допустим, что у нас есть изображение http://example.com/a.jpg. Мне нужно сделать запрос AJAX, отправив это изображение на http://test.com/process.php.

• Я не могу редактировать файл process.php принимать что-либо, чем действительных загруженный файл.
• Поддержка браузеров не имеет значения.

Возможно ли это? Из-за проблем с безопасностью мы можем динамически заполнять поле файла, поэтому, возможно, это еще один способ отправить файл без необходимости выбора файла.

Думаю, что я должен использовать FormData, не уверен.

Answer 1

// Получение файла.

var url = "http://example.com/a.jpg" 
var oReq = new XMLHttpRequest(); 

oReq.onload = function(e) { 
    var blobData = oReq.response; // not responseText 


    // Sending data. 

    var formData = new FormData(); 


    // JavaScript file-like object 
    var blob = new Blob([blobData], { type: "image/jpeg"}); 

    formData.append("webmasterfile", blob); 

    var request = new XMLHttpRequest(); 
    request.open("POST", "http://test.com/process.php"); 
    request.send(formData); 
} 
oReq.open("GET", url, true); 
oReq.responseType = "blob"; 
oReq.send(); 

Ресурсы:

https://developer.mozilla.org/en-US/docs/Web/API/FormData/append

https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest

Answer 2

Скажем, example.com показывает пользователю несколько изображений.

• Пользователь нажимает на изображение
• Запрос GET отправляется на сервер (содержит параметр "изображения")
• сервер делает запрос POST к TEST.COM

So IF вы кодируете сервер в PHP, ваш код должен выглядеть следующим образом (или что-то вроде этого):

<?php 

$image = $_GET['image']; // example.png 
$file = dirname(__FILE__).$image; // /var/www/example/assets/img/example.png 

$ch = curl_init(); 

$data = array('file' => $file); 

curl_setopt($ch, CURLOPT_URL, 'http://test.com/process.php'); 
curl_setopt($ch, CURLOPT_POST, 1); 
curl_setopt($ch, CURLOPT_POSTFIELDS, $data); 

curl_exec($ch); 

?>