Save File de datos locales en Javascript

Heres el escenario:Save File de datos locales en Javascript

usuario viene a mi sitio web y se abre una página web con un poco de la funcionalidad de JavaScript.
El usuario edita los datos a través de javascript
El usuario hace clic en un botón guardar para guardar los datos, parece que no deberían necesitar descargar esta información porque ya está en javascript en la máquina local.

¿Es posible guardar datos de javascript (ejecutándose desde una página web extranjera) sin descargar un archivo del servidor?

¡Cualquier ayuda sería muy apreciada!

Fuente

2010-05-04 Travis

Tenga en cuenta que muchos navegadores ya permiten a los usuarios guardar páginas web. La opción "guardar como página completa" (en cualquier forma que aparezca) generalmente guarda la versión actual de la página, en lugar de lo que se recuperó del servidor. – outis

Correcto, pero creo que el solicitante está pidiendo algo que le permita guardar los datos que se acceden/modifican en la página, no el propio DOM de la página. Al menos, eso es lo que * I * necesito hacer. :-) La respuesta de shaILU sugiere una ligera capacidad de soporte del lado del servidor. – fool4jesus

Para guardar datos del lado del cliente, sin ninguna interacción del servidor, lo mejor que he visto es Downloadify, es una pequeña biblioteca JavaScript + Flash que le permite generar y guardar archivos sobre la marcha, directamente en el navegador. ..

Compruebe esto demo.

Fuente

2010-05-04 01:37:55 CMS

JavaScript se ejecuta en un entorno sandboxed, lo que significa que solo tiene acceso a recursos específicos del navegador. Específicamente, no tiene acceso al sistema de archivos ni a los recursos dinámicos de otros dominios (páginas web, javascript, etc.). Bueno, hay otras cosas (E/S, dispositivos), pero entiendes el punto.

Deberá publicar los datos en el servidor que pueden invocar la descarga de un archivo, o utilizar otra tecnología como flash, applets de Java o Silverlight. (No estoy seguro del soporte para esto en los últimos 2, y tampoco recomendaría su uso, depende de qué sirve ...)

Fuente

2010-05-04 01:38:41

Puede guardar una pequeña cantidad de datos en las cookies.

Fuente

2010-05-04 01:48:59

¿qué tan pequeño? menos de 10ko es bastante bueno. – jokoon

La solución para descargar contenido local/del lado del cliente a través de javascript no es sencillo. Implementé una solución usando smartclient-html-jsp.

Aquí está la solución:

estoy en el proyecto de construcción de SmartClient. Necesitamos descargar/exportar datos de una cuadrícula (tabla como estructura).
Estábamos utilizando servicios web RESTish para servir los datos del lado del servidor. Así que no pude golpear la url dos veces; uno para la red y la segunda vez para exportar/transformar los datos para descargar.
Lo que hice se hizo dos JSP a saber: blank.jsp y export.jsp.
blank.jsp está literalmente en blanco, ahora necesito exportar los datos de la cuadrícula que ya tengo en el lado del cliente.
Ahora, cuando el usuario solicite exportar los datos de la grilla, lo hago a continuación: a. Abra una nueva ventana con url blank.jsp b. using document.write Creo un formulario en él con un texto de nombre de campo y establezco los datos para exportar dentro de él. c. Ahora POST esa forma de export.jsp de la misma jerarquía. d. El contenido de export.jsp que estoy pegando a continuación se explica por sí mismo.

// código de inicio fin

<%@ page import="java.util.*,java.io.*,java.util.Enumeration"%> 
<% 
    response.setContentType ("text/csv"); 
    //set the header and also the Name by which user will be prompted to save 
    response.setHeader ("Content-Disposition", "attachment;filename=\"data.csv\""); 
    String contents = request.getParameter ("text"); 
    if (!(contents!= null && contents!="")) 
     contents = "No data"; 
    else 
     contents = contents.replaceAll ("NEW_LINE", "\n"); 

    //Open an input stream to the file and post the file contents thru the 
    //servlet output stream to the client m/c 

    InputStream in = new ByteArrayInputStream(contents.getBytes()); 
    ServletOutputStream outs = response.getOutputStream(); 

    int bit = 256; 
    int i = 0; 
    try { 
     while ((bit) >= 0) { 
      bit = in.read(); 
      outs.write(bit); 
     } 
     //System.out.println("" +bit); 
    } catch (IOException ioe) { 
     ioe.printStackTrace(System.out); 
    } 
    outs.flush(); 
    outs.close(); 
    in.close(); 
%> 
<HTML> 
<HEAD> 

</HEAD> 

<BODY> 

<script type="text/javascript"> 
    try {window.close();} catch (e) {alert (e);} 
</script> 
</BODY> 
</HTML>

// código

Este código es probado y desplegado/trabajar en un entorno de producción, también se trata de la funcionalidad multi-navegador.

Gracias Shailendra

Fuente

2011-06-23 11:24:16 shaILU

idea muy interesante, gracias. ¿Hay alguna implicación de seguridad, p. cross-site scripting, ya que está proporcionando los datos en la URL y haciendo eco de eso desde el servidor? Parece que, junto con http://stackoverflow.com/questions/365777/starting-file-download-with-javascript, esto proporciona una capacidad muy útil. – fool4jesus

Hola, 1. Los datos no se envían en URL, estoy PUBLICANDO los datos del formulario. 2. Sí, el ActiveX de IE crea el problema si usted publica automáticamente cualquier formulario usando scripts. 3. Esta solución se prueba en IE, FF, Chrome, Safari. – shaILU

me encontré con este escenario cuando quería para iniciar una descarga sin necesidad de utilizar un servidor. Escribí este plugin jQuery que envuelve el contenido de un textarea/div en un Blob, luego inicia una descarga del Blob. Sirve para especificar tanto el nombre del archivo y el tipo ..

jQuery.fn.downld = function (ops) { 
    this.each(function() { 
    var _ops = ops || {}, 
    file_name = _ops.name || "downld_file", 
    file_type = _ops.type || "txt", 
    file_content = $(this).val() || $(this).html(); 

    var _file = new Blob([file_content],{type:'application/octet-stream'}); 
    window.URL = window.URL || window.webkitURL; 

    var a = document.createElement('a'); 
    a.href = window.URL.createObjectURL(_file); 
    a.download = file_name+"."+file_type; 
    document.body.appendChild(a); 
    a.click(); $('a').last().remove(); 
    }); 
}

defecto Uso:. $ ("# Elemento") DownLd();
Opciones: $ ("# element"). Downld ({name: "some_file_name", tipo: "html"});

Codepen ejemplo http://codepen.io/anon/pen/cAqzE

Fuente

2013-04-04 13:49:40 lukejacksonn

Save File de datos locales en Javascript

Respuesta

Cuestiones relacionadas