È possibile scrivere dati su file usando solo JavaScript?

Voglio scrivere dati su file esistenti usando JavaScript. Non voglio stamparlo su console. Voglio effettivamente scrivere i dati in abc.txt. Ho letto molte domande con risposta ma ogni dove sono in stampa su console. in qualche posto hanno dato il codice ma non funziona. Quindi, per favore, qualcuno può aiutarmi Come scrivere effettivamente i dati su File.

Ho fatto riferimento al codice ma non funziona: sta dando errore:

Uncaught TypeError: costruttore illegale

su cromo e

SecurityError: l'operazione non è sicura.

su Mozilla

var f = "sometextfile.txt";

writeTextFile(f, "Spoon")
writeTextFile(f, "Cheese monkey")
writeTextFile(f, "Onion")

function writeTextFile(afilename, output)
{
  var txtFile =new File(afilename);
  txtFile.writeln(output);
  txtFile.close();
}

Quindi possiamo effettivamente scrivere dati su file usando solo Javascript o NOT?

Alcuni suggerimenti per questo -

1. Se si sta tentando di scrivere un file sul computer client, non è possibile farlo in alcun modo tra browser. IE ha metodi per abilitare le applicazioni "attendibili" a utilizzare oggetti ActiveX per leggere / scrivere file.
2. Se stai cercando di salvarlo sul tuo server, passa semplicemente i dati di testo al tuo server ed esegui il codice di scrittura del file usando una lingua lato server.
3. Per memorizzare alcune informazioni sul lato client che sono considerevolmente piccole, puoi scegliere i cookie.
4. Utilizzo dell'API HTML5 per l'archiviazione locale.

È possibile creare file nel browser utilizzando Blobe URL.createObjectURL. Tutti i browser recenti supportano questo .

Non è possibile salvare direttamente il file creato, poiché ciò causerebbe enormi problemi di sicurezza, ma è possibile fornirlo come collegamento per il download per l'utente. Puoi suggerire un nome file tramite l' downloadattributo del link, nei browser che supportano l'attributo download. Come con qualsiasi altro download, l'utente che scarica il file avrà comunque l'ultima parola sul nome del file.

var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});

    // If we are replacing a previously generated file we need to
    // manually revoke the object URL to avoid memory leaks.
    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }

    textFile = window.URL.createObjectURL(data);

    // returns a URL you can use as a href
    return textFile;
  };

Ecco un esempio che utilizza questa tecnica per salvare testo arbitrario da a textarea.

Se si desidera avviare immediatamente il download anziché richiedere all'utente di fare clic su un collegamento, è possibile utilizzare gli eventi del mouse per simulare un clic del mouse sul collegamento come ha fatto la risposta di Lifecube . Ho creato un esempio aggiornato che utilizza questa tecnica.

  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');

  create.addEventListener('click', function () {
    var link = document.createElement('a');
    link.setAttribute('download', 'info.txt');
    link.href = makeTextFile(textbox.value);
    document.body.appendChild(link);

    // wait for the link to be added to the document
    window.requestAnimationFrame(function () {
      var event = new MouseEvent('click');
      link.dispatchEvent(event);
      document.body.removeChild(link);
    });

  }, false);

Se stai parlando del javascript del browser, non puoi scrivere i dati direttamente nel file locale per motivi di sicurezza. La nuova API HTML 5 ti consente solo di leggere i file.

Ma se si desidera scrivere dati e consentire all'utente di scaricare come file in locale. funziona il seguente codice:

    function download(strData, strFileName, strMimeType) {
    var D = document,
        A = arguments,
        a = D.createElement("a"),
        d = A[0],
        n = A[1],
        t = A[2] || "text/plain";

    //build download link:
    a.href = "data:" + strMimeType + "charset=utf-8," + escape(strData);


    if (window.MSBlobBuilder) { // IE10
        var bb = new MSBlobBuilder();
        bb.append(strData);
        return navigator.msSaveBlob(bb, strFileName);
    } /* end if(window.MSBlobBuilder) */



    if ('download' in a) { //FF20, CH19
        a.setAttribute("download", n);
        a.innerHTML = "downloading...";
        D.body.appendChild(a);
        setTimeout(function() {
            var e = D.createEvent("MouseEvents");
            e.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
            a.dispatchEvent(e);
            D.body.removeChild(a);
        }, 66);
        return true;
    }; /* end if('download' in a) */



    //do iframe dataURL download: (older W3)
    var f = D.createElement("iframe");
    D.body.appendChild(f);
    f.src = "data:" + (A[2] ? A[2] : "application/octet-stream") + (window.btoa ? ";base64" : "") + "," + (window.btoa ? window.btoa : escape)(strData);
    setTimeout(function() {
        D.body.removeChild(f);
    }, 333);
    return true;
}

per usarlo:

download('the content of the file', 'filename.txt', 'text/plain');

La risposta sopra è utile, ma ho trovato il codice che ti aiuta a scaricare il file di testo direttamente sul pulsante. In questo codice puoi anche cambiare filenamecome desideri. È pura funzione JavaScript con HTML5. Per me va bene!

function saveTextAsFile()
{
    var textToWrite = document.getElementById("inputTextToSave").value;
    var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'});
    var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;
      var downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = "Download File";
    if (window.webkitURL != null)
    {
        // Chrome allows the link to be clicked
        // without actually adding it to the DOM.
        downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
    }
    else
    {
        // Firefox requires the link to be added to the DOM
        // before it can be clicked.
        downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
        downloadLink.onclick = destroyClickedElement;
        downloadLink.style.display = "none";
        document.body.appendChild(downloadLink);
    }

    downloadLink.click();
}

Provare

let a = document.createElement('a');
a.href = "data:application/octet-stream,"+encodeURIComponent("My DATA");
a.download = 'abc.txt';
a.click();

Nel caso in cui non sia possibile utilizzare la nuova Blobsoluzione, che è sicuramente la migliore soluzione nel browser moderno, è ancora possibile utilizzare questo approccio più semplice, che ha un limite nella dimensione del file tra l'altro:

function download() {
                var fileContents=JSON.stringify(jsonObject, null, 2);
                var fileName= "data.json";

                var pp = document.createElement('a');
                pp.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(fileContents));
                pp.setAttribute('download', fileName);
                pp.click();
            }
            setTimeout(function() {download()}, 500);

$('#download').on("click", function() {
  function download() {
    var jsonObject = {
      "name": "John",
      "age": 31,
      "city": "New York"
    };
    var fileContents = JSON.stringify(jsonObject, null, 2);
    var fileName = "data.json";

    var pp = document.createElement('a');
    pp.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(fileContents));
    pp.setAttribute('download', fileName);
    pp.click();
  }
  setTimeout(function() {
    download()
  }, 500);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="download">Download me</button>

Utilizzare il codice dell'utente @ codice inutile sopra ( https://stackoverflow.com/a/21016088/327386 ) per generare il file. Se si desidera scaricare automaticamente il file, passare textFileciò che è stato appena generato a questa funzione:

var downloadFile = function downloadURL(url) {
    var hiddenIFrameID = 'hiddenDownloader',
    iframe = document.getElementById(hiddenIFrameID);
    if (iframe === null) {
        iframe = document.createElement('iframe');
        iframe.id = hiddenIFrameID;
        iframe.style.display = 'none';
        document.body.appendChild(iframe);
    }
    iframe.src = url;
}

Ho trovato buone risposte qui, ma ho anche trovato un modo più semplice.

Il pulsante per creare il BLOB e il collegamento per il download può essere combinato in un collegamento, poiché l'elemento del collegamento può avere un attributo onclick. (Il contrario non sembra possibile, l'aggiunta di un href a un pulsante non funziona.)

Puoi bootstrapmodellare il link come un pulsante usando , che è ancora javascript puro, tranne che per lo stile.

La combinazione del pulsante e del collegamento per il download riduce anche il codice, poiché getElementByIdsono necessarie meno di quelle brutte chiamate.

Questo esempio richiede solo un clic del pulsante per creare il BLOB di testo e scaricarlo:

<a id="a_btn_writetofile" download="info.txt" href="#" class="btn btn-primary" 
   onclick="exportFile('This is some dummy data.\nAnd some more dummy data.\n', 'a_btn_writetofile')"
>
   Write To File
</a>

<script>
    // URL pointing to the Blob with the file contents
    var objUrl = null;
    // create the blob with file content, and attach the URL to the downloadlink; 
    // NB: link must have the download attribute
    // this method can go to your library
    function exportFile(fileContent, downloadLinkId) {
        // revoke the old object URL to avoid memory leaks.
        if (objUrl !== null) {
            window.URL.revokeObjectURL(objUrl);
        }
        // create the object that contains the file data and that can be referred to with a URL
        var data = new Blob([fileContent], { type: 'text/plain' });
        objUrl = window.URL.createObjectURL(data);
        // attach the object to the download link (styled as button)
        var downloadLinkButton = document.getElementById(downloadLinkId);
        downloadLinkButton.href = objUrl;
    };
</script>

Sì, è possibile Qui il codice è

const fs = require('fs') 
let data = "Learning how to write in a file."
fs.writeFile('Output.txt', data, (err) => { 
      
    // In case of a error throw err. 
    if (err) throw err; 
})