Is het mogelijk om gegevens naar een bestand te schrijven met alleen JavaScript?

Ik wil gegevens naar een bestaand bestand schrijven met JavaScript.
Ik wil het niet op de console afdrukken.
Ik wil eigenlijk gegevens naar abc.txt schrijven.
Ik heb veel beantwoorde vragen gelezen, maar overal waar ze op console afdrukken.
ergens hebben ze code gegeven, maar het werkt niet.
Dus kan iemand me alsjeblieft helpen hoe ik gegevens naar een bestand kan schrijven.

Ik heb de code doorverwezen, maar deze werkt niet:
het geeft een fout:

Uncaught TypeError: illegale constructor

op chroom en

SecurityError: de bewerking is onveilig.

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

Kunnen we dus gegevens naar een bestand schrijven met alleen Javascript of NIET?


Antwoord 1, autoriteit 100%

Enkele suggesties hiervoor –

  1. Als u probeert een bestand op de clientcomputer te schrijven, kunt u dit niet via meerdere browsers doen. IE heeft wel methoden om “vertrouwde” applicaties in staat te stellen ActiveX-objecten te gebruiken om bestanden te lezen/schrijven.
  2. Als u het op uw server probeert op te slaan, geeft u gewoon de tekstgegevens door aan uw server en voert u de code voor het schrijven van het bestand uit met een servertaal.
  3. Om aan de clientzijde wat informatie op te slaan die behoorlijk klein is, kun je cookies gebruiken.
  4. De HTML5 API gebruiken voor lokale opslag.

Antwoord 2, autoriteit 99%

U kunt bestanden in de browser maken met Blob en URL.createObjectURL. Alle recente browsers ondersteunen dit.

Je kunt het bestand dat je aanmaakt niet direct opslaan, aangezien dat enorme beveiligingsproblemen zou veroorzaken, maar je kunt het wel als downloadlink voor de gebruiker verstrekken. U kunt een bestandsnaam voorstellen via het download-kenmerk van de link, in browsers die het downloadkenmerk ondersteunen. Zoals bij elke andere download, heeft de gebruiker die het bestand downloadt echter het laatste woord over de bestandsnaam.

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 is een voorbeeld dat deze techniek gebruikt om willekeurige tekst uit een textarea.

Als u de download onmiddellijk wilt starten in plaats van dat de gebruiker op een link moet klikken, kunt u muisgebeurtenissen gebruiken om een ​​muisklik op de link te simuleren als Lifecube‘s antwoord wel. Ik heb een bijgewerkt voorbeeld gemaakt dat deze techniek gebruikt.

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

Antwoord 3, autoriteit 45%

Als je het hebt over browser-javascript, kun je om veiligheidsredenen geen gegevens rechtstreeks naar een lokaal bestand schrijven. HTML 5 nieuwe API kan u alleen bestanden laten lezen.

Maar als u gegevens wilt schrijven en de gebruiker in staat wilt stellen om als een bestand naar lokaal te downloaden. de volgende code werkt:

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

om het te gebruiken:

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


Antwoord 4, autoriteit 29%

Probeer

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

Antwoord 5, autoriteit 23%

Bovenstaand antwoord is nuttig, maar Ik heb code gevonden die je helpt om een ​​tekstbestand direct te downloaden door op een knop te klikken.
In deze code kunt u ook filename naar wens wijzigen. Het is pure javascript-functie met HTML5.
Werkt voor mij!

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

Antwoord 6, autoriteit 8%

In het geval dat het niet mogelijk is om de nieuwe Blob-oplossing te gebruiken, dat is zeker de beste oplossing in een moderne browser, is het nog steeds mogelijk om deze eenvoudigere aanpak te gebruiken, die een limiet heeft in de bestandsgrootte trouwens:

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>

Antwoord 7, autoriteit 4%

const data = {name: 'Ronn', age: 27};              //sample json
const a = document.createElement('a');
const blob = new Blob([JSON.stringify(data)]);
a.href = URL.createObjectURL(blob);
a.download = 'sample-profile';                     //filename to download
a.click();

Bekijk hier de Blob-documentatie – Blob MDN om extra parameters voor bestandstype. Standaard maakt het een .txt-bestand


Antwoord 8, autoriteit 3%

Gebruik de code van de gebruiker @useless-code hierboven (https://stackoverflow.com/a/21016088/327386) om het bestand te genereren.
Als u het bestand automatisch wilt downloaden, geeft u het zojuist gegenereerde textFile door aan deze functie:

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

Antwoord 9, autoriteit 3%

Ik heb hier goede antwoorden gevonden, maar ook een eenvoudigere manier gevonden.

De knop om de blob te maken en de downloadlink kunnen in één link worden gecombineerd, omdat het link-element een onclick-attribuut kan hebben. (Het omgekeerde lijkt niet mogelijk, het toevoegen van een href aan een knop werkt niet.)

Je kunt de link opmaken als een knop met behulp van bootstrap, wat nog steeds puur javascript is, behalve voor styling.

Het combineren van de knop en de downloadlink vermindert ook de code, omdat er minder van die lelijke getElementById-aanroepen nodig zijn.

Dit voorbeeld heeft slechts één klik op de knop nodig om de tekst-blob te maken en te downloaden:

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

Antwoord 10

Ja het is mogelijk
Hier is de 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; 
}) 

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Other episodes