Чи можливо записувати дані у файл, використовуючи лише JavaScript?

Я хочу записати дані в існуючий файл за допомогою JavaScript. Я не хочу друкувати його на консолі. Я хочу насправді записувати дані abc.txt. Я читав багато відповідей на запитання, але там, де вони друкують на консолі. десь вони дали код, але він не працює. Тож будь ласка, будь-хто може допомогти мені Як насправді записати дані у файл.

Я вказав код, але він не працює: його помилка в наданні:

Uncaught TypeError: Незаконний конструктор

на хром і

SecurityError: Операція небезпечна.

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

Тож чи можемо ми насправді записувати дані у файл, використовуючи лише Javascript або НЕ?

Деякі пропозиції щодо цього -

1. Якщо ви намагаєтесь записати файл на клієнтській машині, ви не можете це зробити жодним крос-браузерним способом. IE має методи, що дозволяють "довіреним" програмам використовувати об'єкти ActiveX для читання / запису файлів.
2. Якщо ви намагаєтеся зберегти їх на своєму сервері, просто передайте текстові дані на ваш сервер та виконайте код написання файлу, використовуючи мову сторони сервера.
3. Щоб зберегти певну інформацію на стороні клієнта, яка значно мала, можна перейти до файлів cookie.
4. Використання HTML5 API для локального зберігання.

Ви можете створювати файли в браузері за допомогою Blobі URL.createObjectURL. Усі останні веб-переглядачі підтримують це .

Ви не можете безпосередньо зберегти створений файл, оскільки це може спричинити великі проблеми із безпекою, але ви можете надати його як посилання для завантаження для користувача. Ви можете запропонувати ім'я файлу через downloadатрибут посилання у веб-переглядачах, які підтримують атрибут завантаження. Як і у випадку з будь-яким іншим завантаженням, користувач, який завантажує файл, має остаточно сказати ім'я файлу.

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

Ось приклад, який використовує цю техніку для збереження довільного тексту з а textarea.

Якщо ви хочете негайно почати завантаження , замість того , щоб вимагати від користувача натиснути на посилання, ви можете використовувати подія миші , щоб імітувати клацання миші по посиланню , як Lifecube «s відповідь зробив. Я створив оновлений приклад, який використовує цю техніку.

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

Якщо ви говорите про JavaScript браузера, ви не можете записати дані безпосередньо в локальний файл з міркувань безпеки. Новий API HTML 5 може дозволяти лише читати файли.

Але якщо ви хочете записати дані, і дозволити користувачеві завантажувати як файл в локальний. працює наступний код:

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

використовувати його:

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

Відповідь вище корисна, але я знайшов код, який допомагає завантажувати текстовий файл безпосередньо при натисканні кнопки. У цьому коді ви також можете змінювати filenameза своїм бажанням. Це чиста функція javascript з HTML5. Для мене працює!

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

Спробуйте

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

У тому випадку, коли неможливо використовувати нове Blobрішення, тобто, безумовно, найкраще рішення в сучасному браузері, все-таки можна скористатися цим більш простим підходом, який до речі має обмеження у розмірі файлу:

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>

Використовуйте код користувачем @ useless-кодом вище ( https://stackoverflow.com/a/21016088/327386 ) для створення файлу. Якщо ви хочете завантажити файл автоматично, передайте textFileщойно створений файл цій функції:

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

Тут я знайшов хороші відповіді, але також знайшов більш простий спосіб.

Кнопку створення блобу та посилання для завантаження можна поєднати в одне посилання, оскільки елемент посилання може мати атрибут onclick. (Зворотний вигляд здається не можливим. Додавання href до кнопки не працює.)

Ви можете стилізувати посилання як кнопку, використовуючи bootstrap, що все ще є чистим JavaScript, за винятком стилів.

Поєднання кнопки та посилання для завантаження також зменшує код, оскільки потрібно менше таких негарних getElementByIdдзвінків.

Цей приклад потребує лише одного натискання кнопки, щоб створити текстовий фрагмент і завантажити його:

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

Так це можливо Тут код є

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