Если вы, например, следуете ссылке:
data:application/octet-stream;base64,SGVsbG8=
Браузер предложит вам загрузить файл, состоящий из данных, содержащихся в базе64 в самой гиперссылке. Есть ли способ предложить имя по умолчанию в разметке? Если нет, есть ли решение для JavaScript?
Используйте атрибут download:
<a download='FileName' href='your_url'>
Пример Live на html5-demos.appspot.com/....
В настоящее время работает над Chrome, Firefox, Edge, Opera, но не Safari 10 или IE11.
Chrome делает это очень просто:
function saveContent(fileContents, fileName)
{
var link = document.createElement('a');
link.download = fileName;
link.href = 'data:,' + fileContents;
link.click();
}
Согласно RFC 2397, нет, нет.
Также нет никакого атрибута элемента <a>, который вы можете использовать.
Однако HTML5 впоследствии ввел атрибут download в элементе <a>, хотя на момент написания поддержка не была универсальной ( без поддержки MSIE, например)
Только HTML: используйте атрибут download:
<a download="logo.gif" href="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7">Download transparent png</a>Я немного искал источники firefox в netwerk/protocol/data/nsDataHandler.cpp
обработчик данных только анализирует содержимое/тип и кодировку и смотрит, есть ли "; base64", в строке
rfc не указывает имя файла и, по крайней мере, firefox не обрабатывает имя файла для него, код генерирует случайное имя плюс ".part"
Я также проверил журнал firefox
[b2e140]: DOCSHELL 6e5ae00 InternalLoad data:application/octet-stream;base64,SGVsbG8=
[b2e140]: Found extension '' (filename is '', handling attachment: 0)
[b2e140]: HelperAppService::DoContent: mime 'application/octet-stream', extension ''
[b2e140]: Getting mimeinfo from type 'application/octet-stream' ext ''
[b2e140]: Extension lookup on '' found: 0x0
[b2e140]: Ext. lookup for '' found 0x0
[b2e140]: OS gave back 0x43609a0 - found: 0
[b2e140]: Searched extras (by type), rv 0x80004005
[b2e140]: MIME Info Summary: Type 'application/octet-stream', Primary Ext ''
[b2e140]: Type/Ext lookup found 0x43609a0
интересные файлы, если вы хотите посмотреть на источники mozilla:
data uri handler: netwerk/protocol/data/nsDataHandler.cpp
where mozilla decides the filename: uriloader/exthandler/nsExternalHelperAppService.cpp
InternalLoad string in the log: docshell/base/nsDocShell.cpp
Я думаю, что вы можете прекратить поиск решения на данный момент, потому что я подозреваю, что его нет:)
как отмечено в этом потоке, html5 имеет атрибут download, он также работает и в firefox 20 http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html#attr-hyperlink-download
Следующий фрагмент Javascript работает в Chrome, используя новый атрибут "загрузка" ссылок и имитирующий щелчок.
function downloadWithName(uri, name) {
var link = document.createElement("a");
link.download = name;
link.href = uri;
link.click();
}
И следующий пример показывает, что он использует:
downloadWithName("data:,Hello%2C%20World!", "helloWorld.txt")
Нет.
Вся цель состоит в том, что это поток данных, а не файл. Источник данных не должен знать, что пользовательский агент обрабатывает его как файл... и это не так.
вы можете добавить атрибут загрузки к элементу привязки.
Пример:
<a download="abcd.cer"
href="data:application/stream;base64,MIIDhTC......">down</a>
Посмотрите на эту ссылку: http://lists.w3.org/Archives/Public/uri/2010Feb/0069.html
Цитата:
Он даже работает (как в, не вызывает проблемы) с; base64 в конце
(в Opera по крайней мере):данные: текст/обычный; кодировка = UTF-8; заголовки = Content-Disposition% 3A %20attachment% 3B %20filename% 3D% 22with %20spaces.txt% 22% 0D% 0AContent-Язык% 3A %20en; base64,4oiaDQo% 3D
Также есть информация в остальных сообщениях обсуждения.
В Google Code есть крошечное обходное решение script, которое сработало для меня:
http://code.google.com/p/download-data-uri/
Он добавляет форму с данными в нее, отправляет ее, а затем снова удаляет форму. Хакки, но это сработало для меня. Требуется jQuery.
Этот поток появился в Google до страницы Google Code, и я подумал, что было бы полезно иметь ссылку здесь тоже.
Это хаки, но я был в той же ситуации раньше. Я динамически генерировал текстовый файл в javascript и хотел предоставить его для загрузки, закодировав его с помощью URI данных.
Это возможно при значительном вмешательстве minor. Создайте ссылку <a href="data:...">right-click me and select "Save Link As..." and save as "example.txt"</a>. Как я уже сказал, это неэлегантно, но оно работает, если вам не нужно профессиональное решение.
Это можно сделать менее болезненным, используя flash, чтобы скопировать имя в буфер обмена. Конечно, если вы позволите себе использовать Flash или Java (теперь, по-моему, с меньшей поддержкой браузера?), Возможно, вы найдете другой способ сделать это.
Вот версия jQuery, основанная на версии Holf, и работает с Chrome и Firefox, тогда как его версия работает только с Chrome. Это немного странно, чтобы добавить что-то к телу, чтобы сделать это, но если у кого-то есть лучший вариант, я все для него.
var exportFileName = "export-" + filename;
$('<a></a>', {
"download": exportFileName,
"href": "data:," + JSON.stringify(exportData, null,5),
"id": "exportDataID"
}).appendTo("body")[0].click().remove();
Используя сервисных работников, это, наконец, возможно в прямом смысле.
<a href, <img src, window.open(url), абсолютно все, что можно сделать с помощью "реального" URL-адреса.Теперь браузер предложит myPrettyName.jpg, даже если пользователь откроет файл на новой вкладке и попытается сохранить его там. Это будет точно так, как если бы файл пришел с сервера.
// In the service worker
self.addEventListener( 'fetch', function(e)
{
if( e.request.url.startsWith( '/blobUri/' ) )
{
// Logic to select correct dataUri, and return it as a Response
e.respondWith( dataURLAsRequest );
}
});
Этот файл работает с Firefox 43.0 (более старый не тестировался):
dl.js:
function download() {
var msg="Hello world!";
var blob = new File([msg], "hello.bin", {"type": "application/octet-stream"});
var a = document.createElement("a");
a.href = URL.createObjectURL(blob);
window.location.href=a;
}
dl.html
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<title>Test</title>
<script type="text/javascript" src="dl.js"></script>
</head>
<body>
<button id="create" type="button" onclick="download();">Download</button>
</body>
</html>
Если кнопка нажата, для загрузки предлагается файл с именем hello.bin. Trick - использовать File вместо Blob.
var isIE = /*@[email protected]*/false || !!document.documentMode; // At least IE6
var sessionId ='\n';
var token = '\n';
var caseId = CaseIDNumber + '\n';
var url = casewebUrl+'\n';
var uri = sessionId + token + caseId + url;//data in file
var fileName = "file.i4cvf";// any file name with any extension
if (isIE)
{
var fileData = ['\ufeff' + uri];
var blobObject = new Blob(fileData);
window.navigator.msSaveOrOpenBlob(blobObject, fileName);
}
else //chrome
{
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(window.TEMPORARY, 1024 * 1024, function (fs) {
fs.root.getFile(fileName, { create: true }, function (fileEntry) {
fileEntry.createWriter(function (fileWriter) {
var fileData = ['\ufeff' + uri];
var blob = new Blob(fileData);
fileWriter.addEventListener("writeend", function () {
var fileUrl = fileEntry.toURL();
var link = document.createElement('a');
link.href = fileUrl;
link.download = fileName;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}, false);
fileWriter.write(blob);
}, function () { });
}, function () { });
}, function () { });
}
Ответ прост, что даже большинство людей этого не ожидали.
Мы можем просто добавить косую черту после загрузки ссылки и поместить нужное имя файла после этой косой черты.
Например:
<a href"http://foo.goo/xxoo.mp4/nice.mp4"></a>
В диалоговом окне загрузки появится имя файла по умолчанию nice.mp4 вместо xxoo.mp4
Данные: URI следуют тому же правилу
Вы действительно можете добиться этого, в Chrome и FireFox.
Попробуйте использовать следующий URL-адрес: он загрузит использованный код.
data:text/html;base64,PGEgaHJlZj0iZGF0YTp0ZXh0L2h0bWw7YmFzZTY0LFBHRWdhSEpsWmowaVVGVlVYMFJCVkVGZlZWSkpYMGhGVWtVaUlHUnZkMjVzYjJGa1BTSjBaWE4wTG1oMGJXd2lQZ284YzJOeWFYQjBQZ3BrYjJOMWJXVnVkQzV4ZFdWeWVWTmxiR1ZqZEc5eUtDZGhKeWt1WTJ4cFkyc29LVHNLUEM5elkzSnBjSFErIiBkb3dubG9hZD0idGVzdC5odG1sIj4KPHNjcmlwdD4KZG9jdW1lbnQucXVlcnlTZWxlY3RvcignYScpLmNsaWNrKCk7Cjwvc2NyaXB0Pg==