La etiqueta a de HTML5 puede usar el atributo download para configurar la descarga del recurso, pero debe ser del mismo origen; si el navegador puede analizarlo, también se abrirá directamente.

En este caso, podemos usar la biblioteca de terceros download para implementar una función de descarga más completa.

Recursos relacionados con download.js:

La biblioteca download.js proporciona la función download() para descargar archivos.

El contenido de la descarga puede ser una URL, cadena, Blob o matriz de datos tipados, o un dataURL que representa los datos del archivo como una cadena codificada en base64 o URL.

Independientemente del formato de entrada, download() guarda el archivo con el nombre de archivo y la información MIME especificados, de la misma manera que un servidor que usa el encabezado HTTP Content-Disposition.

download(data, strFileName, strMimeType);
  • data: el contenido de los datos a descargar, puede ser Blob, File, String o dataURL.
  • strFileName: el nombre del archivo a crear.
  • strMimeType: el tipo de contenido MIME del archivo a descargar.

Ejemplo

Texto

Guardar la cadena en el archivo dlText.txt y descargarla:

download("hello world", "dlText.txt", "text/plain");

Ejemplo de dataURL de texto:

download("data:text/plain,hello%20world", "dlDataUrlText.txt", "text/plain");

Ejemplo de blob de texto:

download(new Blob(["hello world"]), "dlTextBlob.txt", "text/plain");

Ejemplo de URL:

download("/robots.txt");

Ejemplo de matriz de texto UInt8:

var str= "hello world",    arr= new Uint8Array(str.length);
str.split("").forEach(function(a,b){
  arr[b]=a.charCodeAt();
});

download( arr, "textUInt8Array.txt", "text/plain" );

HTML

Ejemplo de cadena html:
download(document.documentElement.outerHTML, "dlHTML.html", "text/html");

Ejemplo de Blob html:

download(new Blob(["hello world".bold()]), "dlHtmlBlob.html", "text/html");

Ejemplo de devolución de llamada ajax:

$.ajax({
        url: "/download.html",
        success: download.bind(true, "text/html", "dlAjaxCallback.html")
});

Archivo binario

URL de la imagen:

download("/diff6.png");

Descargar imagen de forma asíncrona:

var x=new XMLHttpRequest();
x.open( "GET", "/diff6.png" , true);
x.responseType="blob";
x.onload= function(e){download(e.target.response, "awesomesauce.png", "image/png");};
x.send();