1

Tengo este codigo Javascript que me descarga un archivo CSV.

En Chrome funciona perfectamente pero en IE8/IE11 no.

  var csv = "sep=,\nMatrícula:,\nDepartamento:,\nNombre:,Rrhh Desarrollador 01,\nTeléfono:,,\nFactoría:,\nEmail:,[email protected], [email protected],\nEmpresa:,";

    var link = document.createElement("a");
    link.setAttribute("href", "data:text/csv;charset=utf-8,%EF%BB%BF" + escape(csv));
    link.setAttribute("download", "prueba.csv");
    link.click();

No da ningun tipo de error en consola. Lo ejecuta todo pero no descarga el archivo.

He probado creando un elemento blob pero solo vale para IE10+

var csv = "sep=,\nMatrícula:,\nDepartamento:,\nNombre:,Rrhh Desarrollador 01,\nTeléfono:,,\nFactoría:,\nEmail:,[email protected], [email protected],\nEmpresa:,";

var a = document.createElement('a'),
  file = new Blob([csv], {
    type: 'text/csv;charset=utf-8,%EF%BB%BF'
  });
if (window.navigator.msSaveBlob) window.navigator.msSaveBlob(file, "prueba.csv");
else {
  a.href = URL.createObjectURL(file), a.download = "prueba.csv";
  document.body.appendChild(a);
  a.click();
}

Como posible solución, el execCommand -> SaveAs (gracias a la respuesta de Guillermo) pero me parece engorroso ya que abre una ventana nueva con el texto csv como cuerpo de la pagina web y luego abre dialogo de descarga donde pone que descargarás un .html pese a que es .csv

var oWin = window.open("about:blank", "_blank");
oWin.document.writeln(csv);
oWin.document.close();

oWin.document.execCommand('SaveAs', true, "prueba.csv")
oWin.close();

Pero no funciona con Chrome ni con IE11... y quiero tener el minimo numero de codigos para diferentes navegadores...

¿Cómo lo hago compatible para IE8 sin usar execCommand?

6
  • Intenté abrir esta página en IE11 en modo de IE8. Si la abre pero muchas de las características no, por ejemplo, no se muestra el botón Ejecutar de los fragmentos de código JavaScript.
    – Rubén
    el 21 mar. 2017 a las 3:25
  • ¿ y si cambias data:text/csv;... por data:image/jpeg;... ? no tengo IE para probarlo, e IE8 solo soporta ese esquema para imágenes.
    – Trauma
    el 21 mar. 2017 a las 8:33
  • @trauma por que cambiar a imagen? no lo pillo. eso es configuracion del archivo, no de la descarga no?
    – lois6b
    el 21 mar. 2017 a las 9:06
  • @lois6b Porque IE8 solo soporta eso para imágenes; pero no creo que examine los datos, sino que se basará en el mime que tu le indicas; si le dices text/csv, no quedrá. Tal vez si le dices que es un imagen/jpeg esté conforme. De todas formas, el nombre del archivo se lo indicas tu, y es independiente del mime que le indiques.
    – Trauma
    el 21 mar. 2017 a las 9:08
  • 1
    Ah, pues entonces olvida lo que te he dicho. En Google decian que IE no soportaba data:XXX si no era con imágenes; no tengo IE8 (ni ningún otro) para probar, así que solté lo primero que se me ocurrió. En fín, por intentarlo que no quede :-)
    – Trauma
    el 21 mar. 2017 a las 9:13

2 respuestas 2

4
+100

Intenta con esto:

var IEwindow = window.open();
IEwindow.document.write('sep=,\r\n' + CSV));
IEwindow.document.close();
IEwindow.document.execCommand('SaveAs', true, fileName + ".csv");
IEwindow.close();

Aquí un pequeño tutorial de como descargar csv y json multiplataforma

6
  • Cambia la segunda línea por esto IEwindow.document.write(‘sep=,\r\n’ + CSV); el 16 mar. 2017 a las 8:50
  • Si, he leido el enlace entero que pasaste. eso solo indica el separador que ha de usar excel y ya lo tengo incluido en mi variable. No hace que sea compatible con IE
    – lois6b
    el 16 mar. 2017 a las 8:52
  • Guillermo, si ves mi edit, ves que si ha funcionado, pero no se por que antes no ... (quizá el window.open("about:blank", "_blank");) además no vale para IE11, solo IE8 :/
    – lois6b
    el 17 mar. 2017 a las 11:06
  • Si no encuentro otra solucion pasado unos dias, te marco como valida ^^ gracias
    – lois6b
    el 17 mar. 2017 a las 11:07
  • Me alegro de que te haya funcionado ;) el 17 mar. 2017 a las 11:21
2

Te propongo que pruebes la librería Downloadify.

Breve explicación

Esta librería es una minúscula biblioteca JavaScript + Flash que te permite generar archivos a la vez, en el navegador, sin interacción con el servidor. Las aplicaciones web que le permiten generar vCards, paletas de colores, código personalizado, etc. se beneficiarían al usar esta biblioteca. Además de incrementar la velocidad (sin un viaje de ida y vuelta al servidor), esta solución puede reducir la carga de bases de datos y servidores de las aplicaciones web existentes. Esta no es una biblioteca para 'forzar la descarga' de un archivo desde un servidor. No interactúa con un servidor en absoluto.

Dependencias

El usuario final debe tener Flash 10 o superior instalado para que este plugin funcione.

Downloadify sólo depende de SWFObject 2.0 que se incluye con la descarga. Es compatible con cualquier framework de JavaScript pero tiene un ayudante para jQuery y MooTools...

Tienen una página de demo, puedes probar su funcionamiento en línea.

4
  • 1
    Bueno, depender de flash en este caso creo no sería tan malo, teniendo en cuenta que se trata de IE8, es decir, Windows XP.
    – gugadev
    el 21 mar. 2017 a las 2:53
  • Estuve un rato preguntandome como funcionaba el ejemplo online. solo a veces sale el boton! :O además, para su uso he de guardarlo en el servidor (o se puede usar <script>? ) y no tengo acceso a él, por eso usaba javascript .
    – lois6b
    el 21 mar. 2017 a las 6:57
  • @GustavoGarcía Vi la posibilidad de esa biblioteca y quise compartirlo, como una posibilidad. Es cuestión de probar si satisface tus necesidades en este caso.
    – A. Cedano
    el 22 mar. 2017 a las 0:18
  • @Iois6b Esta librería es una minúscula biblioteca JavaScript + Flash que te permite generar archivos a la vez, en el navegador, sin interacción con el servidor. Funciona todo del lado del cliente. ¿Cómo funciona? Pues creo que flash hace una lectura/escaneo del div que contiene el texto y crea a partir de ahí un archivo que lo guardas en local. Yo usé una librería parecida que me copiaba en el portapapeles el contenido de un div determinado usando flash, sólo que en Safari daba algún problema, pues no me copiaba los formatos (negrita, cursiva, etc).
    – A. Cedano
    el 22 mar. 2017 a las 0:22

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.