Создание функции экспорта с помощью JavaScript?

Question

Я пытаюсь настроить функцию экспорта в JavaScript для упакованного веб-приложения, которое превращает строку, хранящуюся в localStorage, в простой текстовый файл для загрузки.Поскольку JavaScript не имеет доступа к файловой системе компьютера, я бы хотел настроить его так, чтобы он создавал пустой текстовый файл (или, в случае неудачи, простую HTML-страницу) и открывался в веб-браузере;поскольку он не будет обращаться к каким-либо файловым системам, я надеялся, что это будет возможно.

Я думал об использовании схемы Data URI для открытия localStorage в виде простого текста, такого как следующее:

function exportFile() {
 window.open("data:text/plain;charset=utf-8," + localStorage.WebAppData);
};

Но это намного медленнее, чем я ожидал, что, я думаю, потому, что он вставляет весь документ в поле URL.Хотя, возможно, это не проблема с кодом, некоторые веб-браузеры, такие как Google Chrome, не позволяют мне сохранить полученный файл.(И по какой-то причине все разрывы строк превратились в пробелы ....)

Будем весьма благодарны за любые предложения по устранению этих проблем или более эффективные способы выполнения аналогичной функции!

Answer 1

Вы пробовали что-то вроде:

window.open("data:text/plain;charset=utf-8," + localStorage.WebAppData);

Для загрузки, я думаю, вам нужно совершить поездку в оба конца на сервер, который установит mime / тип, который заставит всплывающее окно загрузки.

EDIT :
Если вы используете localStorage, может быть window.postMessage доступно в вашей среде и может помочь в скорости.

Answer 2

Чтобы сохранить разрывы строк в данных, экспортированных с помощью window.open, вы можете свернуть свои данные с encodeURI:

var data1 = "Line \n break. And \r\n another one";
window.open("data:application/octet-stream, " + encodeURI(data1));

В противном случае вы можете экспортировать данные, закодированные в base64, с помощью функции btoa:

var data1 = "Line \n break. And \r\n another one";
window.open("data:application/octet-stream;base64, " + btoa(data1));

Answer 3

Не совсем решение, скорее обходной путь, но ваш вопрос и ответ @Mic привели меня по этому пути:

Просто используйте data:text/html, тогда вы можете вводить разрывы строк, используя <br />

1. Я попробовал все остальное (все комбинации символов Юникода и т. Д.), Чтобы получить разрывы строк в text/plain, но не смог их отобразить. document.write() и document.body.textContent() и т. Д. Также страдают от той же проблемы. Разрывы строк просто игнорируются.
2. Поскольку Chrome все равно не позволяет сохранить всплывающее окно, единственный способ извлечь из него текст - это скопировать и вставить, поэтому использование text/plain не выгодно по сравнению с text/html
3. В веб-браузерах, которые позволят вам сохранить страницу (Firefox), вы можете выбрать сохранение страницы в виде текста, а не HTML, и таким образом вы все равно получите тот же конечный результат.

РЕДАКТИРОВАТЬ: Этот подход работает в Chrome, но не Firefox

win = window.open("", "win")
win.document.body.innerText = "Line \n breaks?"

Приходится использовать innerText. InnerHTML или textContent удалить разрывы строк. Это работает на обоих:

<code>win = window.open("", "win")
win.document.body.innerHTML = "<pre>Line \n breaks?

»

Так что, возможно, вы могли бы просто обернуть все в <pre> теги? Хотя я полагаю, что оба они имеют ту же «проблему», что и предложение `
, в том смысле, что он фактически создает документ HTML, а не текстовый / простой текст.