На жаль, відповідь @ BrianFreud не відповідає моїм потребам, у мене була дещо інша потреба, і я знаю, що це не відповідь на питання @ BrianFreud, але я залишаю це, тому що багато людей потрапили сюди з моєю такою ж потребою. Мені знадобилося щось на кшталт "Як отримати файл або крапку з URL-адреси?", І поточна правильна відповідь не відповідає моїм потребам, оскільки це не крос-домен.
У мене є веб-сайт, який використовує зображення з Amazon S3 / Azure Storage, і там я зберігаю об’єкти, названі унікальними ідентифікаторами:
зразок: http: //****.blob.core.windows.net/systemimages/bf142dc9-0185-4aee-a3f4-1e5e95a09bcf
Деякі з цих зображень слід завантажити з нашого системного інтерфейсу. Щоб уникнути передачі цього трафіку через мій сервер HTTP, оскільки цей об’єкт не потребує доступу до будь-якої безпеки (крім фільтрації домену), я вирішив зробити прямий запит у веб-переглядачі користувача та використати локальну обробку, щоб надати файлу справжнє ім'я та розширення.
Щоб досягти того, що я використав цю чудову статтю від Генрі Альгуса:
http://www.henryalgus.com/reading-binary-files-using-jquery-ajax/
1. Перший крок: Додайте бінарну підтримку до jquery
/**
*
* jquery.binarytransport.js
*
* @description. jQuery ajax transport for making binary data type requests.
* @version 1.0
* @author Henry Algus <henryalgus@gmail.com>
*
*/
// use this transport for "binary" data type
$.ajaxTransport("+binary", function (options, originalOptions, jqXHR) {
// check for conditions and support for blob / arraybuffer response type
if (window.FormData && ((options.dataType && (options.dataType == 'binary')) || (options.data && ((window.ArrayBuffer && options.data instanceof ArrayBuffer) || (window.Blob && options.data instanceof Blob))))) {
return {
// create new XMLHttpRequest
send: function (headers, callback) {
// setup all variables
var xhr = new XMLHttpRequest(),
url = options.url,
type = options.type,
async = options.async || true,
// blob or arraybuffer. Default is blob
dataType = options.responseType || "blob",
data = options.data || null,
username = options.username || null,
password = options.password || null;
xhr.addEventListener('load', function () {
var data = {};
data[options.dataType] = xhr.response;
// make callback and send data
callback(xhr.status, xhr.statusText, data, xhr.getAllResponseHeaders());
});
xhr.open(type, url, async, username, password);
// setup custom headers
for (var i in headers) {
xhr.setRequestHeader(i, headers[i]);
}
xhr.responseType = dataType;
xhr.send(data);
},
abort: function () {
jqXHR.abort();
}
};
}
});
2. Другий крок: оформити запит, використовуючи цей вид транспорту.
function downloadArt(url)
{
$.ajax(url, {
dataType: "binary",
processData: false
}).done(function (data) {
// just my logic to name/create files
var filename = url.substr(url.lastIndexOf('/') + 1) + '.png';
var blob = new Blob([data], { type: 'image/png' });
saveAs(blob, filename);
});
}
Тепер ви можете використовувати створений Blob так, як хочете, у моєму випадку я хочу зберегти його на диску.
3. Необов’язково: збережіть файл на комп'ютері користувача за допомогою FileSaver
Я використовував FileSaver.js для збереження завантаженого файлу на диск, якщо вам це потрібно, скористайтеся цією бібліотекою javascript:
https://github.com/eligrey/FileSaver.js/
Я очікую, що це допоможе іншим з більш конкретними потребами.
XMLHttpRequest
URL-адресу краплі.