Apakah mungkin untuk menulis data ke file hanya menggunakan JavaScript?

Saya ingin Menulis Data ke file yang ada menggunakan JavaScript. Saya tidak ingin mencetaknya di konsol. Saya ingin menulis data abc.txt. Saya membaca banyak pertanyaan tetapi di mana mereka mencetak pada konsol. di beberapa tempat mereka telah memberikan kode tetapi tidak berfungsi. Jadi tolong ada yang bisa membantu saya. Bagaimana sebenarnya menulis data ke File.

Saya merujuk kode tetapi tidak berfungsi: kesalahan pemberiannya:

UnEught TypeError: konstruktor ilegal

pada chrome dan

SecurityError: Operasi tidak aman.

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

Jadi bisakah kita benar-benar menulis data ke file hanya menggunakan Javascript atau TIDAK?

Beberapa saran untuk ini -

1. Jika Anda mencoba menulis file di mesin klien, Anda tidak bisa melakukan ini dengan cara lintas-browser. IE memang memiliki metode untuk mengaktifkan aplikasi "tepercaya" untuk menggunakan objek ActiveX untuk membaca / menulis file.
2. Jika Anda mencoba untuk menyimpannya di server Anda maka cukup kirimkan data teks ke server Anda dan jalankan kode penulisan file menggunakan beberapa bahasa sisi server.
3. Untuk menyimpan beberapa informasi di sisi klien yang sangat kecil, Anda dapat menggunakan cookie.
4. Menggunakan API HTML5 untuk Penyimpanan Lokal.

Anda dapat membuat file di browser menggunakan Blobdan URL.createObjectURL. Semua browser terbaru mendukung ini .

Anda tidak dapat langsung menyimpan file yang Anda buat, karena itu akan menyebabkan masalah keamanan besar-besaran, tetapi Anda dapat menyediakannya sebagai tautan unduhan untuk pengguna. Anda dapat menyarankan nama file melalui downloadatribut tautan, di browser yang mendukung atribut unduhan. Seperti halnya unduhan lainnya, pengguna yang mengunduh file tersebut akan memiliki hak suara terakhir atas nama file tersebut.

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

Berikut adalah contoh yang menggunakan teknik ini untuk menyimpan teks sewenang-wenang dari atextarea .

Jika Anda ingin segera memulai download bukan membutuhkan pengguna untuk mengklik pada link, Anda dapat menggunakan peristiwa mouse untuk mensimulasikan klik mouse pada link sebagai Lifecube 's jawaban lakukan. Saya telah membuat contoh yang diperbarui yang menggunakan teknik ini.

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

Jika Anda berbicara tentang javascript browser, Anda tidak dapat menulis data langsung ke file lokal karena alasan keamanan. API HTML 5 baru hanya dapat memungkinkan Anda membaca file.

Tetapi jika Anda ingin menulis data, dan memungkinkan pengguna untuk mengunduh sebagai file ke lokal. kode berikut berfungsi:

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

untuk menggunakannya:

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

Jawaban di atas bermanfaat tetapi, saya menemukan kode yang membantu Anda mengunduh file teks langsung pada klik tombol. Dalam kode ini Anda juga dapat mengubah filenamesesuai keinginan. Ini fungsi javascript murni dengan HTML5. Bekerja untukku!

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

Mencoba

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

Dalam hal ini tidak mungkin untuk menggunakan Blobsolusi baru , yang pasti solusi terbaik di browser modern, masih mungkin untuk menggunakan pendekatan yang lebih sederhana ini, yang memiliki batas ukuran file dengan cara:

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>

Gunakan kode oleh pengguna @ kode tidak berguna di atas ( https://stackoverflow.com/a/21016088/327386 ) untuk menghasilkan file. Jika Anda ingin mengunduh file secara otomatis, berikan textFileyang baru saja dibuat untuk fungsi ini:

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

Saya menemukan jawaban yang bagus di sini, tetapi juga menemukan cara yang lebih sederhana.

Tombol untuk membuat gumpalan dan tautan unduhan dapat digabungkan dalam satu tautan, karena elemen tautan dapat memiliki atribut onclick. (Kebalikannya tampaknya tidak mungkin, menambahkan href ke tombol tidak berfungsi.)

Anda dapat menata tautan dengan menggunakan tombol bootstrap, yang masih berupa javascript murni, kecuali untuk penataan.

Menggabungkan tombol dan tautan unduhan juga mengurangi kode, karena lebih sedikit dari getElementByIdpanggilan buruk itu diperlukan.

Contoh ini hanya perlu satu klik tombol untuk membuat gumpalan teks dan mengunduhnya:

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

Ya itu mungkin di sini kodenya

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