Сохраните данные переменной JS в локальном файле, а также в файле сервера [duplicate]
String a = new String("foo");
String b = new String("foo");
System.out.println(a == b); // prints false
System.out.println(a.equals(b)); // prints true
Убедитесь, что вы понимаете, почему. Это потому, что сравнение == сравнивает только ссылки; equals() метод сопоставляет содержимое по символу.
Когда вы вызываете new для a и b, каждый получает новую ссылку, указывающую на "foo" в таблице строк. Ссылки разные, но контент один и тот же.
9 ответов
Вы не можете делать это исключительно в Javascript.
Вместо этого я бы рекомендовал использовать Downloadify :
Крошечная библиотека javascript + Flash, которая позволяет создавать и скачивать текстовые файлы без взаимодействия с сервером.
Здесь вы можете увидеть простую демонстрацию здесь , где вы поставляете контент, и можете проверить функциональность сохранения / отмены / обработки ошибок.
Javascript имеет API файловой системы. Если вы можете иметь дело с тем, что функция работает только в Chrome, хорошей отправной точкой будет: http://www.html5rocks.com/en/tutorials/file/filesystem/ .
function download(text, name, type) {
var a = document.getElementById("a");
var file = new Blob([text], {type: type});
a.href = URL.createObjectURL(file);
a.download = name;
}<a href="" id="a">click here to download your file</a>
<button onclick="download('file text', 'myfilename.txt', 'text/plain')">Create file</button>И вы затем загрузите файл, поместив атрибут загрузки в тег привязки.
Причина, по которой я как это лучше, чем создание URL-адреса данных, так это то, что вам не нужно делать большой длинный URL-адрес, вы можете просто создать временный URL-адрес.
-
1@Banjocat Вы должны проверить, поддерживает ли браузер определенные объекты. Пример обнаружения:
if("URL"in window&&"createObjectURL"in URL&&"download"in Element.prototype): иначе вы просто измените способ загрузки или заметите, что браузер не поддерживает необходимые объекты для загрузки файла. – hydroper 20 January 2016 в 23:24 -
2
-
3@Soren В настоящее время он не работает ни в одной версии IE, насколько я знаю. У Safari тоже может не быть этого, но я не работаю с ними, и мне придется искать его. – Awesomeness01 31 March 2016 в 03:45
-
4Не работает в Google Chrome. Я собираюсь сделать это как букмарклет
javascript:function download(text, name, type) { var a = document.getElementById("content"); var file = new Blob([text], {type: type}); a.href = URL.createObjectURL(file); a.download = name; }– Jeno 1 April 2016 в 10:03 -
5Это не работает в IE 11.0.9600.18426, но работает в Chrome 52.0.2743.116 m. Любые идеи, чтобы заставить это работать в IE 11? – trueimage 24 August 2016 в 19:22
-
6Мне кажется, что
var a = document.createElement("a")должен находиться в ветвиelse, иначе IE10 + создаст, но не удалит элемент привязки (<a>). – Andrew Willems 22 January 2017 в 22:12 -
7В firefox это работает, если вы нажмете ссылку, но если вы щелкните правой кнопкой мыши и выберите Save Link As ... ничего не произойдет. – aamarks 28 April 2018 в 05:04
Пробовал это в консоли, и он работает.
var aFileParts = ['<a id="a"><b id="b">hey!</b></a>'];
var oMyBlob = new Blob(aFileParts, {type : 'text/html'}); // the blob
window.open(URL.createObjectURL(oMyBlob));
Этот проект в github выглядит многообещающим:
https://github.com/eligrey/FileSaver.js
FileSaver.js реализует интерфейс W3C saveAs () FileSaver в браузерах, которые его не поддерживают.
Также посмотрите здесь демо:
-
1w3.org/TR/file-writer-api/#the-filesaver-interface говорит, что «Работа над этим документом была прекращена, и на нее не следует ссылаться или использоваться в качестве основы для реализации». ; – Godsmith 8 June 2015 в 16:35
-
2
-
3
-
4Весь код доступен в git, как и следовало ожидать. Не знаете, какова цель «что это такое?». комментарий был. Если бы действительно хотелось узнать, что это такое, то w3.org/TR/file-writer-api поможет. Если бы он указывал, что проект был отменен, эта информация находится в README git. – WesR 25 December 2017 в 20:24
-
5@Godsmith, я не думаю, что это имеет значение, поскольку кажется, что он возвращает createObjectURL или любой другой метод, который работает для сохранения файла, и обрабатывает различия браузера как можно лучше. – aamarks 27 April 2018 в 17:12
Выбор местоположения для сохранения файла перед его созданием невозможен. Но возможно, по крайней мере в Chrome, генерировать файлы, используя только JavaScript. Вот старый пример создания CSV-файла. Пользователю будет предложено загрузить его. Это, к сожалению, плохо работает в других браузерах, особенно IE.
<!DOCTYPE html>
<html>
<head>
<title>JS CSV</title>
</head>
<body>
<button id="b">export to CSV</button>
<script type="text/javascript">
function exportToCsv() {
var myCsv = "Col1,Col2,Col3\nval1,val2,val3";
window.open('data:text/csv;charset=utf-8,' + escape(myCsv));
}
var button = document.getElementById('b');
button.addEventListener('click', exportToCsv);
</script>
</body>
</html>
-
1Когда я использую это, он открывает новую вкладку с текстом в ней, она не открывает диалоговое окно файла. – user1756980 15 November 2012 в 22:13
-
2@ user1756980 - Да. Вам нужно будет «Сохранить в файл». с этой новой вкладки. – Jesse Chisholm 22 July 2014 в 18:44
-
3Это зависит от браузера, os и т. Д. В то время, когда я написал ответ, URL-адрес csv в Chrome появлялся в диалоговом окне сохранения – Matt Greer 22 July 2014 в 21:53
-
4@JesseChisholm вы можете сделать это в javascript. просто создайте привязывающий тег в переменной и поместите на него атрибут загрузки (например: a.download = & quot; downloadname.txt & quot;) и затем щелкните его с помощью a.click (). – Awesomeness01 30 March 2015 в 05:50
-
5@ Awesomeness01 - Спасибо. Так много новых изменений HTML5, чтобы учиться. – Jesse Chisholm 31 March 2015 в 19:11
Для последнего браузера, такого как Chrome, вы можете использовать API-интерфейс , как в этом учебнике :
window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(window.PERSISTENT, 5*1024*1024 /*5MB*/, saveFile, errorHandler);
-
1Я думаю, что этот фрагмент кода будет ближе к намерению афер. – Fabrício Matté 15 November 2012 в 22:08
-
2См. Здесь доказательства его мертвости: lists.w3.org/Archives/Public/public-webapps/2014AprJun/… – voidstate 30 September 2014 в 14:43
setTimeout("create('Hello world!', 'myfile.txt', 'text/plain')");
function create(text, name, type) {
var dlbtn = document.getElementById("dlbtn");
var file = new Blob([text], {type: type});
dlbtn.href = URL.createObjectURL(file);
dlbtn.download = name;
}<a href="javascript:void(0)" id="dlbtn"><button>click here to download your file</button></a>Для Chrome и Firefox я использую только метод JavaScript.
(Мое приложение не может использовать пакет, такой как Blob.js, потому что он обслуживается специальным движком: DSP с
function FileSave(sourceText, fileIdentity) {
var workElement = document.createElement("a");
if ('download' in workElement) {
workElement.href = "data:" + 'text/plain' + "charset=utf-8," + escape(sourceText);
workElement.setAttribute("download", fileIdentity);
document.body.appendChild(workElement);
var eventMouse = document.createEvent("MouseEvents");
eventMouse.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
workElement.dispatchEvent(eventMouse);
document.body.removeChild(workElement);
} else throw 'File saving not supported for this browser';
}
Примечания, оговорки и ласковые слова:
- У меня был успех с этим кодом как в Chrome, так и в Firefox, работающих в средах Linux (Maipo) и Windows (7 и 10).
- Однако, если
sourceTextбольше, чем MB, Chrome иногда (только иногда) застревает в его собственная загрузка без указания отказа; До сих пор Firefox не демонстрировал такого поведения. Причиной может быть некоторое ограничение blob в Chrome. Честно говоря, я просто не знаю; если у кого-нибудь есть идеи по исправлению (или, по крайней мере, обнаружению), отправьте сообщение. Если возникает аномалия загрузки, когда браузер Chrome закрыт, он генерирует диагностику, такую как - . Этот код несовместим с Edge или Internet Explorer; Я не пробовал Opera или Safari.
