2012-06-17 4 views
10

У вас уже есть решение для записи файла JSON в Интернете, но я хочу сохранить файл json локально. Я попытался использовать этот пример http://jsfiddle.net/RZBbY/10/ Создает ссылку для скачивания файла, используя этот вызов a.attr('href', 'data:application/x-json;base64,' + btoa(t.val())).show(); Есть ли способ сохранить файл локально вместо предоставления загружаемой ссылки? Существуют другие типы конверсий за пределами data:application/x-json;base64?Как сохранить JavaScript в локальном файле?

Вот мой код:

<!DOCTYPE html> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Sortable - Default functionality</title> 

    <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css"> 
    <script src="http://jqueryui.com//jquery-1.7.2.js"></script> 
    <script src="http://jqueryui.com/ui/jquery.ui.core.js"></script> 
    <script src="http://jqueryui.com/ui/jquery.ui.widget.js"></script> 
    <script src="http://jqueryui.com/ui/jquery.ui.mouse.js"></script> 
    <script src="http://jqueryui.com/ui/jquery.ui.sortable.js"></script> 
     <script src="http://jqueryui.com/ui/jquery.ui.accordion.js"></script> 
    <link rel="stylesheet" href="http://jqueryui.com/demos/demos.css">   
    <meta charset="utf-8"> 
    <style>a { font: 12px Arial; color: #ac9095; }</style> 
<script type='text/javascript'> 
$(document).ready(function() { 
var f = $('form'), a = $('a'), 
    i = $('input'), t = $('textarea'); 

$('#salva').click(function() { 
    var o = {}, v = t.val(); 

    a.hide();//nasconde il contenuto 
    i.each(function() { 
    o[this.name] = $(this).val(); }); 
    if (v === '') { 
     t.val("[\n " + JSON.stringify(o) + " \n]")   
    } 
    else { 
     t.val(v.substr(0, v.length - 3)); 
     t.val(t.val() + ",\n " + JSON.stringify(o) + " \n]") 
    } 
}); 
}); 

$('#esporta').bind('click', function() { 
    a.attr('href', 'data:application/x-json;base64,' + btoa(t.val())).show(); 

}); 
</script> 
</head> 
<body> 
    <form> 
     <label>Nome</label> <input type="text" name="nome"><br /> 
     <label>Cognome</label> <input type="text" name="cognome"> 
     <button type="button" id="salva">Salva</button> 
    </form>   

    <textarea rows="10" cols="60"></textarea><br /> 
    <button type="button" id="esporta">Esporta dati</button> 
    <a href="" style="display: none">Scarica Dati</a> 
</body> 
</html> 

ответ

7

Это не возможно сохранить файл локально без участия локального клиента (браузер машины), как я мог бы быть большой угрозой для клиентской машины. Вы можете использовать ссылку для загрузки этого файла. Если вы хотите сохранить что-то вроде данных JSON на локальной машине вы можете использовать LocalStorage предоставляемого браузеров, Web Storage

+7

Спасибо, это может быть неправильная информация, но я не знал этого раньше и использовал для этого помощь. Может быть, пожалуйста, скажите мне, что не так в той конкретной ссылке, которую я дал в ответ. – Adil

+1

Thx !!! Теперь я изучаю веб-хранилище, но есть другие типы преобразования за пределами данных: application/x-json; base64? –

+1

Uao ROdneyrehm Я не знал об этом сайте wfools.com –

1

Итак, ваш реального вопрос: «Как JavaScript может сохранить в локальный файл?»

Посмотрите на http://www.tiddlywiki.com/

Они сохраняют свою страницу HTML локально после того как вы «изменились» его изнутри.

[UPDATE 2016.01.31]

TiddlyWiki оригинальная версия сохранена непосредственно. Это было неплохо и сохранено в настраиваемом каталоге резервного копирования с отметкой времени как часть имени файла резервной копии.

TiddlyWiki Текущая версия просто загружает его как любую загрузку файла. Вам необходимо сделать свое собственное управление резервным копированием. :(

[КОНЕЦ UPDATE

Хитрость заключается в том, что вам нужно открыть страницу как файл: // не как HTTP:. // чтобы иметь возможность сохранить локально

в области безопасности на вашем браузер не позволит вам сохранить _someone_else's_ локальную систему, только свой собственный, и даже тогда это не является тривиальным.

-Jesse

+1

Теперь я изучаю Tiddlywiki, но Существуют другие типы преобразования за пределами данных: application/x-json; base64? –

+0

tiddlywiki использует java-апплет для доступа к локальной файловой системе, а не javascript. –

+3

TiddlyWiki использует Java-апплет для Safari и Opera. Для IE он использует ActiveX, а для Firefox/Camino он использует чистый javascript (через privilegeManager) или расширение firefox (так как privilegeManager был удален в v15). – dwurf

3

все зависит от того, что вы пытаетесь достичь с помощью «экономии локально ". Вы хотите разрешить пользователю загружать файл? then <a download> - это путь. Вы хотите сохранить его локально, чтобы восстановить состояние приложения? Затем вы можете посмотреть различные варианты WebStorage. В частности, localStorage или IndexedDB. FilesystemAPI позволяет создавать локальные виртуальные файловые системы можно хранить произвольные данные в.

+1

thx, но Существуют и другие типы преобразования за пределами данных: application/x-json; base64? –

+1

Помимо того, что это должно быть ['application/json'] (http://stackoverflow.com/a/477819/515124) - нет, я не вижу, что еще имеет смысл. – rodneyrehm

+1

С IndexedDB, как можно загрузить локально? –

11

Вы должны проверить атрибут download и метод window.URL, поскольку атрибут download не похож, как данные URI. Это example by Google - это в значительной степени то, что вы пытаетесь сделать.

+0

+1 Я пробовал данные uri schema в прошлом, он работает, но он решает, как назвать файл, в котором вы закончили, так что он почти бесполезен. Я пробовал это в Firefox, Safari, Opera и Chrome на Mac, Safari и Opera не имеет «BlobBuilder». Таким образом, отказ от «только канала Chrome dev» (14.0.835.15+) поддерживает этот атрибут «отчасти верно. В это время он работает на FireFox, он не работает в Safari и Opera. – Shanimal

+0

Blob Builder предположительно работает в MSIE, а также ... http://ie.microsoft.com/testdrive/HTML5/BlobBuilder/ – Shanimal

2

В то время как большинство презирающих Flash, это жизнеспособный вариант для обеспечения функциональности «сохранить» и «сохранить как» в среде html/javascript.

Я создал виджет под названием "OpenSave", который обеспечивает эту функциональность доступна здесь:

http://www.gieson.com/Library/projects/utilities/opensave/

-Mike

+0

можно ли сохранить все в тегах заголовка и тела, используя это? –