Thật không may, câu trả lời của @ BrianFreud không phù hợp với nhu cầu của tôi, tôi có một nhu cầu khác và tôi biết đó không phải là câu trả lời cho câu hỏi của @ BrianFreud, nhưng tôi để nó ở đây vì nhiều người có cùng nhu cầu của tôi. Tôi cần một cái gì đó như 'Làm cách nào để lấy tệp hoặc blob từ một URL?' Và câu trả lời đúng hiện tại không phù hợp với nhu cầu của tôi vì nó không phải là tên miền chéo.
Tôi có một trang web tiêu thụ hình ảnh từ Bộ lưu trữ S3 / Azure của Amazon và ở đó tôi lưu trữ các đối tượng có tên duy nhất:
mẫu: http: //****.blob.core.windows.net/systemimages/bf142dc9-0185-4aee-a3f4-1e5e95a09bcf
Một số hình ảnh này nên được tải xuống từ giao diện hệ thống của chúng tôi. Để tránh truyền lưu lượng này qua máy chủ HTTP của tôi, vì các đối tượng này không yêu cầu bất kỳ bảo mật nào được truy cập (ngoại trừ bằng cách lọc tên miền), tôi đã quyết định thực hiện một yêu cầu trực tiếp trên trình duyệt của người dùng và sử dụng xử lý cục bộ để đặt tên thật cho tệp và sự mở rộng.
Để thực hiện điều đó tôi đã sử dụng bài viết tuyệt vời này từ Henry Algus:
http://www.henryalgus.com/reading-binary-files-USE-jquery-ajax/
1. Bước đầu tiên: Thêm hỗ trợ nhị phân cho 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. Bước thứ hai: Thực hiện một yêu cầu sử dụng loại vận chuyển này.
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);
});
}
Bây giờ bạn có thể sử dụng Blob được tạo như bạn muốn, trong trường hợp của tôi, tôi muốn lưu nó vào đĩa.
3. Tùy chọn: Lưu tệp trên máy tính của người dùng bằng FileSaver
Tôi đã sử dụng FileSaver.js để lưu vào đĩa đã tải xuống, nếu bạn cần thực hiện điều đó, vui lòng sử dụng thư viện javascript này:
https://github.com/eligrey/FileSaver.js/
Tôi hy vọng điều này sẽ giúp những người khác có nhu cầu cụ thể hơn.
XMLHttpRequestURL đến blob.