¿Cómo leer y escribir en un archivo usando JavaScript?

¿Alguien puede dar un código de muestra para leer y escribir un archivo usando JavaScript?

Para completar, el OP no declara que está buscando hacer esto en un navegador (si lo está, como se ha dicho, generalmente no es posible)

Sin embargo, javascript per se permite esto; Se puede hacer con JavaScript del lado del servidor.

Consulte esta documentación sobre la clase de archivo Javascript

Editar : Ese enlace fue a los documentos de Sun que ahora Oracle ha movido.

Para mantenerse al día con los tiempos, aquí está la documentación de node.js para la clase FileSystem: http://nodejs.org/docs/latest/api/fs.html

Editar (2) : puede leer archivos del lado del cliente ahora con HTML5: http://www.html5rocks.com/en/tutorials/file/dndfiles/

No. JavaScript del lado del navegador no tiene permiso para escribir en la máquina cliente sin tener que deshabilitar muchas opciones de seguridad

¡El futuro está aquí! Las propuestas están más cerca de completarse, no más ActiveX o flash o java. Ahora podemos usar:

• API del sistema de archivos

• Acceso nativo a archivos de arrastrar y soltar

Puede usar Arrastrar / Soltar para obtener el archivo en el navegador, o un simple control de carga. Una vez que el usuario ha seleccionado un archivo, puede leerlo con Javascript: http://www.html5rocks.com/en/tutorials/file/dndfiles/

aquí está la propuesta de mozilla

http://www-archive.mozilla.org/js/js-file-object.html

esto se implementa con un interruptor de compilación en spidermonkey, y también en el script extendido de adobe. Además (creo) obtienes el objeto File en extensiones de firefox.

Rhino tiene una función readFile (más bien grosera) https://developer.mozilla.org/en/Rhino_Shell

para operaciones de archivo más complejas en rhino, puede usar los métodos java.io.File.

Sin embargo, no obtendrá nada de esto en el navegador. Para una funcionalidad similar en un navegador, puede utilizar las funciones de base de datos SQL de HTML5, persistencia del cliente, cookies y objetos de almacenamiento flash.

Esta función Javascript presenta un cuadro de diálogo completo "Guardar como" para el usuario que ejecuta esto a través del navegador. El usuario presiona OK y el archivo se guarda.

Editar: El siguiente código solo funciona con el navegador IE, ya que Firefox y Chrome han considerado este código como un problema de seguridad y han bloqueado su funcionamiento.

// content is the data you'll write to file<br/>
// filename is the filename<br/>
// what I did is use iFrame as a buffer, fill it up with text
function save_content_to_file(content, filename)
{
    var dlg = false;
    with(document){
     ir=createElement('iframe');
     ir.id='ifr';
     ir.location='about.blank';
     ir.style.display='none';
     body.appendChild(ir);
      with(getElementById('ifr').contentWindow.document){
           open("text/plain", "replace");
           charset = "utf-8";
           write(content);
           close();
           document.charset = "utf-8";
           dlg = execCommand('SaveAs', false, filename+'.txt');
       }
       body.removeChild(ir);
     }
    return dlg;
}

Invocar la función:

save_content_to_file("Hello", "C:\\test");

Si está utilizando JScript (Javascript de Microsoft) para hacer secuencias de comandos locales utilizando WSH (¡NO en un navegador!), Puede utilizarlo Scripting.FileSystemObjectpara acceder al sistema de archivos.

Creo que puede acceder al mismo objeto en IE si desactiva muchas configuraciones de seguridad, pero sería una muy, muy mala idea.

MSDN aquí

Actualmente, los archivos se pueden escribir y leer desde el contexto de una ventana / pestaña del navegador con File , FileWriter y FileSystem API , aunque existen advertencias para su uso (consulte el reverso de esta respuesta).

Pero para responder tu pregunta:

Usando BakedGoods *

Escribir archivo:

bakedGoods.set({
    data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
    storageTypes: ["fileSystem"],
    options: {fileSystem:{storageType: Window.PERSISTENT}},
    complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});

Leer archivo:

bakedGoods.get({
        data: ["testFile"],
        storageTypes: ["fileSystem"],
        options: {fileSystem:{storageType: Window.PERSISTENT}},
        complete: function(resultDataObj, byStorageTypeErrorObj){}
});

Uso de las API de File, FileWriter y FileSystem sin formato

Escribir archivo:

function onQuotaRequestSuccess(grantedQuota)
{

    function saveFile(directoryEntry)
    {

        function createFileWriter(fileEntry)
        {

            function write(fileWriter)
            {
                var dataBlob = new Blob(["Hello world!"], {type: "text/plain"});
                fileWriter.write(dataBlob);              
            }

            fileEntry.createWriter(write);
        }

        directoryEntry.getFile(
            "testFile", 
            {create: true, exclusive: true},
            createFileWriter
        );
    }

    requestFileSystem(Window.PERSISTENT, grantedQuota, saveFile);
}

var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);

Leer archivo:

function onQuotaRequestSuccess(grantedQuota)
{

    function getfile(directoryEntry)
    {

        function readFile(fileEntry)
        {

            function read(file)
            {
                var fileReader = new FileReader();

                fileReader.onload = function(){var fileData = fileReader.result};
                fileReader.readAsText(file);             
            }

            fileEntry.file(read);
        }

        directoryEntry.getFile(
            "testFile", 
            {create: false},
            readFile
        );
    }

    requestFileSystem(Window.PERSISTENT, grantedQuota, getFile);
}

var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);

Justo lo que pediste, ¿verdad? Tal vez tal vez no. Las dos últimas de las API:

• Actualmente solo se implementan en navegadores basados ​​en Chromium (Chrome y Opera)
• Han sido retirados del seguimiento de estándares del W3C y, a partir de ahora, son API patentadas
• Puede ser eliminado de los navegadores implementadores en el futuro
• Restrinja la creación de archivos a un entorno limitado (una ubicación fuera de la cual los archivos no pueden producir ningún efecto) en el disco

Además, la especificación FileSystem no define pautas sobre cómo aparecerán las estructuras de directorios en el disco. En los navegadores basados ​​en Chromium, por ejemplo, el sandbox tiene un sistema de archivos virtual (una estructura de directorios que no existe necesariamente en el disco de la misma forma que cuando se accede desde el navegador), dentro del cual los directorios y archivos creados con Se colocan las API.

Entonces, aunque puede escribir archivos en un sistema con las API, localizar los archivos sin las API (bueno, sin la API de FileSystem) podría ser un asunto no trivial.

Si puede lidiar con estos problemas / limitaciones, estas API son prácticamente la única forma nativa de hacer lo que ha pedido.

Si está abierto a soluciones no nativas, Silverlight también permite la entrada y salida de archivos desde un concurso de pestañas / ventanas a través de IsolatedStorage . Sin embargo, se requiere código administrado para utilizar esta instalación; Una solución que requiere escribir dicho código está más allá del alcance de esta pregunta.

Por supuesto, una solución que hace uso de código administrado complementario, dejando uno con solo Javascript para escribir, está dentro del alcance de esta pregunta;):

//Write file to first of either FileSystem or IsolatedStorage
bakedGoods.set({
    data: [{key: "testFile", value: "Hello world!", dataFormat: "text/plain"}],
    storageTypes: ["fileSystem", "silverlight"],
    options: {fileSystem:{storageType: Window.PERSISTENT}},
    complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});

* BakedGoods es una biblioteca de Javascript que establece una interfaz uniforme que se puede utilizar para realizar operaciones de almacenamiento comunes en todas las instalaciones de almacenamiento nativas y no nativas. Es mantenido por este tipo aquí:).

Para Firefox:

var file = Components.classes["@mozilla.org/file/local;1"].
       createInstance(Components.interfaces.nsILocalFile);
file.initWithPath("/home");

Ver https://developer.mozilla.org/en-US/docs/Code_snippets/File_I_O

Para otros, echa un vistazo a la aplicación TiddlyWiki para ver cómo funciona.

En el contexto del navegador, Javascript puede LEER el archivo especificado por el usuario. Consulte el blog de Eric Bidelman para obtener detalles sobre la lectura de archivos con File API. Sin embargo, no es posible que Javascript basado en navegador ESCRIBA el sistema de archivos de la computadora local sin deshabilitar algunas configuraciones de seguridad porque se considera como una amenaza de seguridad para cualquier sitio web cambiar arbitrariamente su sistema de archivos local.

Dicho esto, hay algunas formas de solucionarlo dependiendo de lo que intente hacer:

1. Si es su propio sitio, puede incrustar un Java Applet en la página web. Sin embargo, el visitante debe instalar Java en la máquina local y recibirá una alerta sobre el riesgo de seguridad. El visitante debe permitir que se cargue el applet. Un Applet Java es como un software ejecutable que tiene acceso completo a la computadora local.

2. Chrome admite un sistema de archivos que es una parte de espacio aislado del sistema de archivos local. Vea esta página para más detalles. Posiblemente, esto le permita guardar temporalmente cosas localmente. Sin embargo, esto no es compatible con otros navegadores.

3. Si no está limitado al navegador, Node.js tiene una interfaz completa del sistema de archivos. Consulte aquí la documentación del sistema de archivos . Tenga en cuenta que Node.js puede ejecutarse no solo en servidores, sino también en cualquier computadora cliente, incluidas las ventanas. El corredor de prueba de JavaScript Karma se basa en Node.js. Si solo desea programar en javascript en la computadora local, esta es una opción.

Para crear un archivo intente

function makefile(){
  var fso;
  var thefile;

    fso = new ActiveXObject("Scripting.FileSystemObject");
    thefile=fso.CreateTextFile("C:\\tmp\\MyFile.txt",true);

    thefile.close()
    }

Cree su directorio en la unidad C porque Windows tiene seguridad contra escritura desde la web, por ejemplo, cree una carpeta llamada "tmp" en la unidad C.

Tendrá que recurrir a Flash, Java o Silverlight. En el caso de Silverlight, verás Almacenamiento aislado . Eso le permitirá escribir en archivos en su propio patio de juegos en el disco de los usuarios. Sin embargo, no te permitirá escribir fuera de tu patio de recreo.

No puede hacer esto de ninguna manera entre navegadores. IE tiene métodos para permitir que las aplicaciones "confiables" usen objetos ActiveX para leer / escribir archivos, pero desafortunadamente eso es todo.

Si está buscando guardar información del usuario, lo más probable es que necesite usar cookies.

De una prueba de ReactJS, el siguiente código escribe con éxito un archivo:

import writeJsonFile from 'write-json-file';

const ans = 42;
writeJsonFile('answer.txt', ans);

const json = {"answer": ans};
writeJsonFile('answer_json.txt', json);

El archivo se escribe en el directorio que contiene las pruebas, por lo que escribir en un archivo JSON real '* .json' crea un bucle.

No puede hacer E / S de archivos en el lado del cliente usando JavaScript, ya que eso sería un riesgo de seguridad. Tendría que hacer que descarguen y ejecuten un exe, o si el archivo está en su servidor, use AJAX y un lenguaje del lado del servidor como PHP para hacer la E / S en el lado del servidor

Hay dos formas de leer y escribir un archivo usando JavaScript

1. Usar extensiones de JavaScript

2. Usando una página web y objetos Active X

Aquí hay una solución de escritura para Chrome v52 + (el usuario aún debe seleccionar una gama de destino ...)
fuente: StreamSaver.js

<!-- load StreamSaver.js before streams polyfill to detect support -->
<script src="StreamSaver.js"></script>
<script src="https://wzrd.in/standalone/web-streams-polyfill@latest"></script>

const writeStream = streamSaver.createWriteStream('filename.txt')
const encoder = new TextEncoder
let data = 'a'.repeat(1024)
let uint8array = encoder.encode(data + "\n\n")

writeStream.write(uint8array) // must be uInt8array
writeStream.close()

El más adecuado para escribir grandes datos generados en el lado del cliente.
De lo contrario, sugiero usar FileSaver.js para guardar Blob / Files