Descargar contenido de textarea como un archivo usando solo Javascript (no en el servidor)

Me piden que haga un botón de "descarga" que descarga el contenido de un área de texto en la misma página como un archivo, con el "Guardar como" del navegador ... "apareciendo el diálogo. Copiar/pegar haría el trabajo bien, pero es un "requisito".Descargar contenido de textarea como un archivo usando solo Javascript (no en el servidor)

En este momento, solo estoy publicando los contenidos del área de texto en el servidor, que los echos atrás con Content-disposition: attachment abofeteado. ¿Hay alguna manera de hacer esto con solo JavaScript del lado del cliente?

Fuente

2009-03-04 Thilo

Respuesta corta: no es posible. Debe enviarlo al servidor y la respuesta del servidor puede ser "Disposición de contenido: archivo adjunto".

Fuente

2009-03-04 07:16:53 firem

Puede probar window.location = "data:application/octet-stream,"+text pero eso no proporciona un mecanismo mediante el cual pueda sugerir un nombre, y también IE tiene un límite muy pequeño en la longitud máxima de un URI de datos que podría ser un problema.

Fuente

2009-03-04 07:28:53 olliej

Y ni siquiera es posible con IE6. –

genial. http://en.wikipedia.org/wiki/Data_URI_scheme – Thilo

Se podría ser posible mediante la creación de un marco, escribir contenidos allí, a continuación, llamar document.execCommand('saveas', ...) en IE y algo con nsIFilePicker en Mozilla, pero creo que eso requeriría algunos privilegios extraordinarios (como ser parte del propio navegador) .

Fuente

2009-03-04 07:38:42

Posible de hecho y no requiere ningún privilegio especial .. ver aquí: http://jsfiddle.net/YhdSC/1/ (IE solo a través de: /) –

Sí, el privilegio parte era más sobre Firefox. –

Hubo algunas bibliotecas de Javascript que hicieron este tipo de cosas, a través de un pequeño archivo SWF incrustado. Por ejemplo, this one.

Fuente

2010-06-07 23:00:15 yacoob

Esto es más de una respuesta a la pregunta en mi opinión. Quiero decir, me ayudó y gracias por eso :) –

¿Hay otras bibliotecas como esta? – Husman

he encontrado una solución simple aquí: http://www.codingforums.com/archive/index.php/t-181561.html

My text area:<br /> 
<textarea rows='10' cols='80' id='myTextArea' ></textarea> 

<br /><br /> 

Download button: <br /> 
<input value='download' type='button' 
onclick='doDL(document.getElementById("myTextArea").value)' /> 


<script type='text/javascript'> 
function doDL(s){ 
    function dataUrl(data) {return "data:x-application/text," + escape(data);} 
    window.open(dataUrl(s)); 
} 
</script>

esperan que ayude.

Fuente

2013-07-05 10:31:57

está utilizando un tipo de contenido no válido; ¿la aplicación/octet-stream no tiene el mismo efecto? –

@CyrLop - respuesta impresionante que publicó aquí .... ¿sabe si hay una forma de codificar un nombre de archivo para que el diálogo de salvar se abra con un nombre de archivo que el usuario puede editar, pero esa es, por ejemplo, la fecha actual - aaaammdd.TXT ? – tamak

Esto puede ser lo que buscas: http://thiscouldbebetter.wordpress.com/2012/12/18/loading-editing-and-saving-a-text-file-in-html5-using-javascrip/

Utiliza el diálogo de descargas del navegador, pero sólo es compatible con FF y Chrome, y tal vez más navegadores ahora?

Editar:

como se ha comentado Voy a incrustar el código del artículo:

function saveTextAsFile() 
{ 
    var textToWrite = //Your text input; 
    var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'}); 
    var fileNameToSaveAs = //Your filename; 

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

Fuente

2013-10-12 09:17:43 NatureShade

Si bien esto podría responder teóricamente a la pregunta, [sería preferible] (http://meta.stackexchange.com/q/8259) incluir aquí las partes esenciales de la respuesta y proporcionar el enlace de referencia. –

especialmente porque Wordpress está bloqueado aquí en China ... – Thilo

Hoy ya no es necesario buscar webkitURL. http://caniuse.com/#search=URL Parece que Edge aún no es compatible con esta característica –

absolutamente posible usar este navegador cruz implementación de JavaScript de la función HTML5 saveAs: https://github.com/koffsyrup/FileSaver.js

Si todo lo que quiere hacer es guardar texto, entonces la secuencia de comandos anterior funciona en todos los navegadores (incluidas todas las versiones de IE), no se requiere SWF.

Fuente

2015-05-28 13:32:38 superphonic

Descargar contenido de textarea como un archivo usando solo Javascript (no en el servidor)

Respuesta

Cuestiones relacionadas