É possível escrever dados para arquivo usando apenas JavaScript?

quero escrever dados para um ficheiro existente usando JavaScript. Não quero imprimi-lo na consola. Eu quero realmente escrever dados para abc.txt. Eu li muitas perguntas respondidas, mas todos os lugares onde eles estão imprimindo no console. em algum lugar eles deram código, mas não está funcionando. Então, por favor, qualquer um pode me ajudar a realmente escrever dados para arquivo.

Fiz referência ao código, mas não está a funcionar.: seu erro de entrega:

 Uncaught TypeError: Illegal constructor 

em cromado e

 SecurityError: The operation is insecure.

Em 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();
}
Então ... podemos realmente escrever dados para arquivo usando apenas Javascript ou não? Por favor, ajuda-me Obrigado antecipadamente.
Author: Shomz, 2014-01-09

7 answers

Algumas sugestões para isto ...
  1. Se está a tentar escrever um ficheiro na máquina do cliente,não pode fazer isto de forma cruzada. O IE tem métodos para activar as aplicações "confiáveis" para usar os objectos ActiveX para ler/escrever o ficheiro.
  2. Se está a tentar gravá-lo no seu servidor, então simplesmente passe os dados de texto para o seu servidor e execute o código de escrita do ficheiro usando alguma linguagem do lado do servidor.
  3. para guardar algumas informações do lado do cliente que são consideravelmente pequeno, podes ir comer biscoitos.
  4. Usando a API HTML5 para armazenamento Local.
 66
Author: Sujit Agarwal, 2014-01-09 06:01:36

Você pode criar ficheiros no navegador usando Blob e URL.createObjectURL. Todos os navegadores recentes suportam isto .

Você não pode salvar diretamente o arquivo que você cria, uma vez que isso causaria enormes problemas de segurança, mas você pode fornecê-lo como um link de download para o usuário. Você pode sugerir um nome de arquivo através do download atributo da ligação, nos navegadores que suportam o atributo download. Como em qualquer outro download, o usuário baixando o arquivo terá o a última palavra no nome do ficheiro.

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

Aqui está um exemplo que usa esta técnica para salvar texto arbitrário de um textarea.

Se quiser iniciar imediatamente a transferência em vez de exigir que o utilizador carregue numa ligação, poderá usar os Eventos do rato para simular um botão do rato na ligação como O Lifecube's } respondeu. Criei um exemplo atualizado que usa esta técnica.

  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);
 161
Author: Useless Code, 2017-05-23 11:47:19

Se está a falar do navegador javascript, não pode escrever dados directamente para um ficheiro local por razões de segurança. A nova API HTML 5 só lhe permite ler arquivos.

Mas se quiser escrever dados, e permitir que o utilizador baixe como um ficheiro para o local. o seguinte código funciona:

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

Para o usar:

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

 35
Author: Lifecube, 2014-01-09 06:11:01

A resposta acima é útil mas, encontrei o código que o ajuda a transferir o ficheiro de texto directamente no botão, carregue. Neste código você também pode mudar filename como desejar. É uma função javascript pura com HTML5. Por mim tudo bem!

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();
}
 18
Author: Niraj, 2015-09-30 05:25:38

No caso de não ser possível utilizar a nova Blob solução, que é com certeza a melhor solução no navegador moderno, ainda é possível usar essa abordagem mais simples, que tem um limite no tamanho do arquivo pelo caminho:

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>
 4
Author: loretoparisi, 2018-04-19 14:56:33

Use o código pelo utilizador @useless-code above ( https://stackoverflow.com/a/21016088/327386 ) para gerar o ficheiro. Se quiser obter o ficheiro automaticamente, passe o textFile que foi gerado para esta função:

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;
}
 3
Author: RPM, 2017-05-23 10:31:12
Encontrei boas respostas aqui, mas também encontrei uma maneira mais simples.

O botão para criar o blob e o link de download pode ser combinado em um link, uma vez que o elemento link pode ter um atributo onclick. (O inverso parece não ser possível, adicionar um href a um botão não funciona.)

Você pode classificar a ligação como um botão usando bootstrap, que ainda é javascript puro, exceto para o estilo.

Combinar o botão e o link de download também reduz o código, pois menos daqueles feios São necessárias chamadas.

Este exemplo só precisa de um botão para criar o texto-blob e transferi-lo:

<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>
 1
Author: Roland, 2018-07-12 11:56:33