Как на клиентском JavaScript создать некий текст и сохранить

[mmotor]

Нужно дать пользователю возможность сохранить некий текст в файл, даже если отключен интернет

[Deff]

mmotor,
Сохранить в один из вариантов Storage браузера, наиболее просто в localStorage, но убивается очисткой Кеша, про менее распространённые методы можно почитать в гугле, к примеру FileApi

[kostyanet]

Локально через data url, например http://stackoverflow.com/a/18197511/2607462

[alex_rr]

мб localStorage подойдёт?

[kostyanet]

А как из localStorage сохранить текст в файл на диск?

[Leon-on12]

А как из localStorage сохранить текст в файл на диск?

Ну если мы знаем ключ. И работаем в IE с плохими настройками безопасности, то наверное можно использовать activeX.
Достаём из локала и юзаем актив.

[Deff]

Основная задача не сохранить на диск - явно, а сделать данные нестираемые при очиске кеша браузера, а сохранить можно и на сервер при восстановлении связи. Для этого есть (не во всех браузерах) иные Storage и FileApi

[mmotor]

Благодарю за ответы. У меня основная задача все таки сохранить на диск, причем в пределах текущей сессии.

В целом я сделал так

window.open("data:application/octet-stream," + (JSON.stringify(content)), "fail");

Теперь возник вопрос, как задать имя файлу.

[рони]

mmotor,
window.open("data:application/octet-stream," + (JSON.stringify(content)), input.value+".txt");

[mmotor]

window.open("data:application/octet-stream," + (JSON.stringify("df")), "d.txt");

нету имени у файла заданного

[kostyanet]

Основная задача не сохранить на диск - явно

Там же написано - сохранить в файл. Где еще файлы могут быть?

Теперь возник вопрос, как задать имя файлу.

Еще можно тупо в атрибуте download="filename.ext" если через мгновенно созданную ссылку.

[kostyanet]

Вот кусок из юзер-скрипта сохраняющий массив в чесеве:


if(rows.length) {
var blob = new Blob(rows, {type:'text/csv'}),
link = document.createElement("a");
link.download = file_name+'.csv';
link.style.display='none';
link.href = window.URL.createObjectURL(blob);
link = document.body.appendChild(link);
link.click();
var timeoutID = setTimeout(function() {
link = document.body.removeChild(link);
delete link;
window.clearTimeout(timeoutID);
}, 1500);
}


Возможно ФФ-специфичный, попробуйте приделать к своим реалиям. Через блоб получается лучше чем через дата-урл напрямую.

ЗЫ Для фактуры http://stackoverflow.com/questions/13405129/javascript-create-and-save-file

[рони]

mmotor,

function download(filename, text) {
var blob = new Blob([text], {type:'text/csv'}),
link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.setAttribute('download', filename);
var event = document.createEvent('MouseEvents');
event.initEvent('click', true, true);
link.dispatchEvent(event);
}
download('test.txt', 'Hello world! Hello world!');

[kostyanet]

if (document.createEvent) то click() не сработает?

[рони]

kostyanet,
нет не сработает, проверить как всегда кому-то лень -- можно убрать link.click(); только ветка document.createEvent

[kostyanet]

Ну я и говорю, а если document.createEvent то click() не сработает?

[рони]

kostyanet,
нет Firefox не будет реагировать на такой клик, Chrome безразлично сработает в обоих случаях, click() оставлен про запас не нравится можно убрать.

[kostyanet]

Chrome безразлично сработает в обоих случаях

То есть Хром попадет и в тот, и в другой зуб вилки?

Я одного не пойму - вы же видите что условие вычисляется в true

если document.createEvent то click() не сработает?

но второй раз уже отвечаете как будто в false.

Короче, прямым текстом - в каком браузере a.click() не сработает и понадобится сооружать кастомное событие и поджигать?

[рони]

kostyanet,
в Firefox не сработает click()

[рони]

kostyanet,
убрал лишнее смотрите 13 пост

[kostyanet]

в Firefox не сработает click()


Это с какого года?

Ладно, не важно. Вы просто скопировали сырец с СО по моей ссылке, чтобы любовно оформить его в тегах "запустить". В этом же вы видите вашу великую миссию - подсовывать ламерам готовенькое за плюсики. Звучит гимн героев советского союза... :)

Разумеется в ФФ .click() работает и давно и получше чем в других браузерах.

[рони]

Разумеется в ФФ .click() работает и давно и получше чем в других браузерах.
шедевр!!!вам хоть иногда ... , видимо нет :)

[kostyanet]

Да ему просто не под силу признать факт, теперь будет делать круглые глаза, изображать патетику и охать. Как будто я не видел таких светочей.

[рони]

kostyanet
хорошо пусть в вашей вселенной клик в ФФ работает
тогда этот код для вас
function download(filename, text) {
var blob = new Blob([text], {type:'text/csv'}),
link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.setAttribute('download', filename);
link.click()
}
download('test.txt', 'Hello world! Hello world!');

остальным я рекомендую не этот а рабочий код в 13 посте.
буду считать что вы kostyanet невнимательны, при чтении тем.

[kostyanet]

буду считать что вы kostyanet невнимательны, при чтении тем.

Это вы профессор. Что вы щелкать-то собираетесь? Абстрактный элемент которого еще нет дома? Само собой он не будет щелкаться, а браузеры которые дают такое щелкать - не нормальные. ФФ не дает? Значит в ФФ все сделано правильно.

Надо в дом засунуть и тогда хоть где хоть защелкайся. То есть смысл той вилки все равно нулевой. Нет никакой связи между наличием кастомных событий и возможной фичей браузера который дает щелкать по абстрактному элементу (ну типа элементу в теневом доме). Потому что вы подепили тот снипет лишь бы оформить.

Вот что надо вставить перед link.click():


link = document.body.appendChild(link);
link.click();


Ну, типа да, затем придется удалить или просто закешировать и затем навешивать другие урлы и имена файлов.

[рони]

Вот что надо вставить перед link.click():
одно радует что вы разобрались, и дали разумное обьяснение, жаль что до этого вы счёлкали Абстрактный элемент которого еще нет дома?
сейчас если хотите делайте круглые глаза, изображайте, патетику и охайте.
мир по прежнему вокруг вас одни дураки.
да, а где код с интерфейсом для Ну, типа да, затем придется удалить или просто закешировать и затем навешивать другие урлы и имена файлов. ? (не надо кода, я вам так верю)

[kostyanet]

да, а где код с интерфейсом для

Делайте квадратные глаза http://javascript.ru/forum/dom-window/56942-kak-na-klientskom-javascript-sozdat-nekijj-tekst-i-sokhranit-2.html#post379204

[рони]

kostyanet,
только как догадатся что rows это массив с текстом? вижу недоработочка в интерфейсе, добавьте поле ввода с проверкой, чтоб не гонять пустой массив, а то вы как то не по программистки.

[kostyanet]

Признаю вашу наглость и позволяю приделать к тому кусочку все что пожелаете.

Для тех кто тоже нипонял: текст надо засунуть в [], то есть вот так передать [text]

[mmotor]

mmotor,

function download(filename, text) {
var blob = new Blob([text], {type:'text/csv'}),
link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.setAttribute('download', filename);
var event = document.createEvent('MouseEvents');
event.initEvent('click', true, true);
link.dispatchEvent(event);
}
download('test.txt', 'Hello world! Hello world!');

В IE не работает

[рони]

В IE не работает

:blink:
сохранение текста в файл для Google Chrome и Mozilla Firefox

[mmotor]

Ну так а как в IE то сделать?

[Deff]

mmotor,
Вы бы сказали конечную задачу, возможно( а тем более в ИЕ) сохранять без файла. Наверняка не затем, чтобы читать файл самому пользователю? (Или да ?) Думаю, вы хотите затем загрузить этот файл при обрыве инет-соединения ? В ИЕ есть ведь и другие способы сохранить данные, к примеру порыть в сторону behavior

[mmotor]

Подскажите, а как здесь делают?

http://eligrey.com/demos/FileSaver.js/

[mmotor]

Подскажите, а как теперь сохранить картинку таким же образом

[Lemme]

http://javascript.ru/forum/misc/58150-kakie-est-resheniya-dlya-vytyagivaniya-izobrazhenijj-s-interneta-po-url.html#post387523