Ответ 1
Идеи:
-
Попробуйте
<a href="data:...." target="_blank">
(Untested) -
Используйте downloadify вместо URL-адресов данных (также будет работать и для IE)
Я играю с идеей создания полностью основанной на javascript программы zip/unzip, доступной любому пользователю из браузера. Они могут просто перетащить zip прямо в браузер, и это позволит им загружать все файлы внутри. Они также могут создавать новые zip файлы, перетаскивая отдельные файлы.
Я знаю, что было бы лучше сделать это serveride, но этот проект просто для удовольствия.
Перетаскивание файлов в браузер должно быть достаточно простым, если я использую различные доступные методы. (стиль gmail)
Кодирование/декодирование, надеюсь, будет прекрасным. Я видел некоторые zip-библиотеки as3, поэтому я уверен, что с этим все в порядке.
Моя проблема заключается в загрузке файлов в конце.
window.location = 'data:jpg/image;base64,/9j/4AAQSkZJR....'
это отлично работает в firefox, но не в хроме.
Я могу вставлять файлы в виде изображений, просто найти в chrome с помощью <img src="data:jpg/image;ba.." />
, но файлы не обязательно будут изображениями. Они могут быть в любом формате.
Может ли кто-нибудь подумать о другом решении или о какой-то работе?
Идеи:
Попробуйте <a href="data:...." target="_blank">
(Untested)
Используйте downloadify вместо URL-адресов данных (также будет работать и для IE)
Если вы также хотите дать предлагаемое имя файлу (вместо загрузки по умолчанию), вы можете использовать следующее в Chrome, Firefox и некоторых версиях IE:
function downloadURI(uri, name) {
var link = document.createElement("a");
link.download = name;
link.href = uri;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
delete link;
}
И следующий пример показывает, что он использует:
downloadURI("data:text/html,HelloWorld!", "helloWorld.txt");
function download(dataurl, filename) {
var a = document.createElement("a");
a.href = dataurl;
a.setAttribute("download", filename);
a.click();
}
download("data:text/html,HelloWorld!", "helloWorld.txt");
Хочу поделиться своим опытом и помочь кому-то застрявшему на загрузках не работающему в Firefox и обновленном ответе до 2014 года. Приведенный ниже фрагмент кода будет работать как в Firefox, так и в Chrome, и будет принимать имя файла:
// Construct the <a> element
var link = document.createElement("a");
link.download = thefilename;
// Construct the uri
var uri = 'data:text/csv;charset=utf-8;base64,' + someb64data
link.href = uri;
document.body.appendChild(link);
link.click();
// Cleanup the DOM
document.body.removeChild(link);
Вот чистое решение JavaScript, которое я тестировал, работая в Firefox и Chrome, но не в Internet Explorer:
function downloadDataUrlFromJavascript(filename, dataUrl) {
// Construct the 'a' element
var link = document.createElement("a");
link.download = filename;
link.target = "_blank";
// Construct the URI
link.href = dataUrl;
document.body.appendChild(link);
link.click();
// Cleanup the DOM
document.body.removeChild(link);
delete link;
}
Кросс-браузерные решения найдены до сих пор:
downloadify → Требуется Flash
databounce → Проверено в IE 10 и 11 и не работает для меня. Требуется сервлет и некоторые настройки. (Неправильно обнаруживает навигатор. Мне нужно было установить IE в режиме совместимости для тестирования, кодировку по умолчанию в сервлете, объект параметров JavaScript с правильным путем сервлета для абсолютных путей...) Для браузеров, отличных от IE, файл открывается в том же окне.
download.js → http://danml.com/download.html Другая библиотека, похожая, но не проверенная. Заявляет, что это чистый JavaScript, не требует ни сервлета, ни Flash, но не работает в IE & lt; = 9.
Существует несколько решений, но они зависят от HTML5 и не реализованы полностью в некоторых браузерах. Примеры ниже были протестированы в Chrome и Firefox (частично работает).
document.location.href
в URI данных.<a href="your-data-uri" download="filename.txt">
для указания имени файла.Объединяя ответы от @owencm и @Chazt3n, эта функция позволит загружать текст из IE11, Firefox и Chrome. (Извините, у меня нет доступа к Safari или Opera, но, пожалуйста, добавьте комментарий, если вы попробуете, и он работает.)
initiate_user_download = function(file_name, mime_type, text) {
// Anything but IE works here
if (undefined === window.navigator.msSaveOrOpenBlob) {
var e = document.createElement('a');
var href = 'data:' + mime_type + ';charset=utf-8,' + encodeURIComponent(text);
e.setAttribute('href', href);
e.setAttribute('download', file_name);
document.body.appendChild(e);
e.click();
document.body.removeChild(e);
}
// IE-specific code
else {
var charCodeArr = new Array(text.length);
for (var i = 0; i < text.length; ++i) {
var charCode = text.charCodeAt(i);
charCodeArr[i] = charCode;
}
var blob = new Blob([new Uint8Array(charCodeArr)], {type: mime_type});
window.navigator.msSaveOrOpenBlob(blob, file_name);
}
}
// Example:
initiate_user_download('data.csv', 'text/csv', 'Sample,Data,Here\n1,2,3\n');
Можно также инициировать загрузку URL-адресов через JavaScript. См. fooobar.com/questions/83620/... для такого решения (вместе с примерами текстовых ссылок).
Для тех, у кого есть проблемы в IE:
Пожалуйста, поддержите ответ здесь Йетти: сохранение холста локально в IE
dataURItoBlob = function(dataURI) {
var binary = atob(dataURI.split(',')[1]);
var array = [];
for(var i = 0; i < binary.length; i++) {
array.push(binary.charCodeAt(i));
}
return new Blob([new Uint8Array(array)], {type: 'image/png'});
}
var blob = dataURItoBlob(uri);
window.navigator.msSaveOrOpenBlob(blob, "my-image.png");
Ваша проблема существенно сводится к тому, что "не все браузеры будут поддерживать это".
Вы можете попробовать обходной путь и открыть распакованные файлы из объекта Flash, но тогда вы потеряете чистоту JS (во всяком случае, я не уверен, можете ли вы в настоящее время "перетащить файлы в браузер" без какого-либо рода обходного пути Flash - это возможность HTML5, возможно?)