web-dev-qa-db-fra.com

Comment JavaScript peut-il être sauvegardé dans un fichier local?

Il existe déjà une solution pour écrire le fichier JSON en ligne mais je veux enregistrer le fichier json localement ... J'ai essayé d'utiliser cet exemple http://jsfiddle.net/RZBbY/10/ Il crée un lien pour télécharger le fichier, en utilisant cet appela.attr('href', 'data:application/x-json;base64,' + btoa(t.val())).show();est-il possible de sauvegarder le fichier localement au lieu de fournir un lien téléchargeable? Il existe d'autres types de conversion au-delà de data:application/x-json;base64?

Voici mon code:

<!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>
11
Mirko Cianfarani

Vous devriez vérifier l'attribut download et la méthode window.URL, car l'attribut download ne semble pas aimer les données URI . Cet exemple de de Google est à peu près ce que vous essayez de faire.

12
Calvein

Il n'est pas possible de sauvegarder le fichier localement sans impliquer le client local (ordinateur de navigation) car je pourrais être une grande menace pour l'ordinateur client. Vous pouvez utiliser link pour télécharger ce fichier. Si vous souhaitez stocker quelque chose comme des données Json sur la machine locale vous pouvez utiliser LocalStorage fourni par les navigateurs, Stockage Web

9
Adil

Tout dépend de ce que vous essayez de réaliser avec "enregistrer localement". Voulez-vous autoriser l'utilisateur à télécharger le fichier? alors <a download> est la voie à suivre. Voulez-vous l'enregistrer localement afin de pouvoir restaurer l'état de votre application? Ensuite, vous voudrez peut-être examiner les différentes options de WebStorage . Plus précisément, localStorage ou IndexedDB . FilesystemAPI vous permet de créer des systèmes de fichiers virtuels locaux dans lesquels vous pouvez stocker des données arbitraires.

3
rodneyrehm

Même si la plupart des gens méprisent Flash, c'est une option viable pour fournir les fonctionnalités "enregistrer en tant que" et "enregistrer en tant que" dans votre environnement HTML/JavaScript. 

J'ai créé un widget appelé "OpenSave" qui fournit cette fonctionnalité disponible ici:

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

-Mike

2
bob

Votre question real est donc la suivante: "Comment JavaScript peut-il être enregistré dans un fichier local?"

Jetez un coup d'œil à http://www.tiddlywiki.com/

Ils sauvegardent leur page HTML localement après que vous l’ayez "modifiée" en interne.

[MISE À JOUR 2016.01.31]

Version originale de TiddlyWiki enregistrée directement. C'était assez sympa, et sauvegardé dans un répertoire de sauvegarde configurable avec l'horodatage dans le nom du fichier de sauvegarde.

La version actuelle de TiddlyWiki le télécharge en tant que téléchargement de fichier. Vous devez faire votre propre gestion de sauvegarde. :(

[FIN DE MISE À JOUR

Le truc, c'est que vous devez ouvrir la page en tant que fichier: // pas en tant que http: // pour pouvoir enregistrer localement.

La sécurité de votre navigateur ne vous permettra pas de sauvegarder sur le système local de _soneone_else's_, mais uniquement sur le vôtre, et même dans ce cas, ce n’est pas anodin.

-Jesse

1
Jesse Chisholm

Si vous utilisez FireFox, vous pouvez utiliser le File HandleAPI

https://developer.mozilla.org/en-US/docs/Web/API/File_Handle_API

Je venais de le tester et ça marche!

0
Kbdavis07