Ist es möglich, Daten nur mit JavaScript in eine Datei zu schreiben?

Ich möchte Daten mit JavaScript in eine vorhandene Datei schreiben. Ich möchte es nicht auf der Konsole drucken. Ich möchte tatsächlich Daten schreiben an abc.txt. Ich habe viele beantwortete Fragen gelesen, aber überall dort, wo sie auf der Konsole drucken. Irgendwann haben sie Code gegeben, aber er funktioniert nicht. Kann mir bitte jemand helfen, wie man tatsächlich Daten in eine Datei schreibt?

Ich habe den Code verwiesen, aber er funktioniert nicht: Es gibt einen Fehler:

Nicht erfasster TypeError: Unzulässiger Konstruktor

auf Chrom und

SecurityError: Der Vorgang ist unsicher.

auf 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();
}

Können wir also tatsächlich Daten nur mit Javascript oder NICHT in eine Datei schreiben?

Einige Vorschläge dazu -

1. Wenn Sie versuchen, eine Datei auf dem Client-Computer zu schreiben, können Sie dies nicht browserübergreifend tun. IE verfügt über Methoden, mit denen "vertrauenswürdige" Anwendungen ActiveX-Objekte zum Lesen / Schreiben von Dateien verwenden können.
2. Wenn Sie versuchen, es auf Ihrem Server zu speichern, geben Sie die Textdaten einfach an Ihren Server weiter und führen Sie den Dateischreibcode in einer serverseitigen Sprache aus.
3. Um auf der Clientseite einige Informationen zu speichern, die sehr klein sind, können Sie Cookies verwenden.
4. Verwenden der HTML5-API für den lokalen Speicher.

Sie können Dateien im Browser mit Blobund erstellen URL.createObjectURL. Alle neueren Browser unterstützen dies .

Sie können die von Ihnen erstellte Datei nicht direkt speichern, da dies zu massiven Sicherheitsproblemen führen würde. Sie können sie jedoch als Download-Link für den Benutzer bereitstellen. Sie können einen Dateinamen über das downloadAttribut des Links in Browsern vorschlagen , die das Download-Attribut unterstützen. Wie bei jedem anderen Download hat der Benutzer, der die Datei herunterlädt, das letzte Wort über den Dateinamen.

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;
  };

Hier ist ein Beispiel , das diese Technik verwendet, um beliebigen Text aus a zu speichern textarea.

Wenn Sie den Download sofort starten möchten, anstatt den Benutzer auf einen Link klicken zu müssen, können Sie Mausereignisse verwenden, um einen Mausklick auf den Link zu simulieren, wie es die Antwort von Lifecube getan hat. Ich habe ein aktualisiertes Beispiel erstellt , das diese Technik verwendet.

  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);

Wenn Sie über Browser-Javascript sprechen, können Sie aus Sicherheitsgründen keine Daten direkt in die lokale Datei schreiben. Mit der neuen HTML 5-API können Sie nur Dateien lesen.

Wenn Sie jedoch Daten schreiben und dem Benutzer das Herunterladen als Datei in die lokale Datei ermöglichen möchten. Der folgende Code funktioniert:

    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;
}

um es zu benutzen:

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

Die obige Antwort ist nützlich, aber ich habe Code gefunden, mit dem Sie Textdateien direkt beim Klicken auf die Schaltfläche herunterladen können. In diesem Code können filenameSie auch nach Belieben ändern . Es ist eine reine Javascript-Funktion mit HTML5. Funktioniert bei mir!

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();
}

Versuchen

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

Für den Fall, dass es nicht möglich ist, die neue BlobLösung zu verwenden, die mit Sicherheit die beste Lösung in einem modernen Browser ist, ist es immer noch möglich, diesen einfacheren Ansatz zu verwenden, der übrigens eine Begrenzung der Dateigröße aufweist:

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>

Verwenden Sie den Code des Benutzers @ nutzloser-Code oben ( https://stackoverflow.com/a/21016088/327386 ), um die Datei zu generieren. Wenn Sie die Datei automatisch herunterladen möchten, übergeben Sie die textFilesoeben generierte an diese Funktion:

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;
}

Ich habe hier gute Antworten gefunden, aber auch einen einfacheren Weg gefunden.

Die Schaltfläche zum Erstellen des Blobs und des Download-Links kann in einem Link kombiniert werden, da das Link-Element ein Onclick-Attribut haben kann. (Das Gegenteil scheint nicht möglich zu sein. Das Hinzufügen eines href zu einer Schaltfläche funktioniert nicht.)

Sie können den Link als Schaltfläche mit gestalten bootstrap formatieren, bis auf das Styling immer noch reines Javascript verwenden.

Durch das Kombinieren der Schaltfläche und des Download-Links wird auch der Code reduziert, da weniger davon hässlich sind getElementById Aufrufe benötigt werden.

In diesem Beispiel ist nur ein Klick erforderlich, um den Text-Blob zu erstellen und herunterzuladen:

<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>

Ja es ist möglich Hier ist der Code

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; 
})