html - webkitdeveloperextras - ¿Cómo hacer que Safari e IE descarguen la imagen en lugar de abrirla en una página nueva?
ver codigo fuente en safari iphone (4)
¿Estás trabajando en un servidor Apache? Si es así, puedes agregar esto a tu archivo .htaccess:
RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{QUERY_STRING} fdl=1
RewriteRule .? - [T=application/octet-stream]
Comprueba si es un archivo. Comprueba si el parámetro fdl = 1 está en la salida de la cadena de consulta como descarga de octeto / fuerza.
Ahora, cuando desee que el navegador comience a descargar algo en ese sitio, simplemente coloque el parámetro en la url:
<a href="img.jpg?fdl=1">Download Image</a>
Para hacer lo mismo en un servidor Windows de IIS, agregue la regla de salida a web.config:
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<outboundRules>
<rule name="Force Download">
<match serverVariable="RESPONSE_Content_Disposition" pattern=".?" negate="false" />
<action type="Rewrite" value="application/octet-stream" replace="true" />
<conditions>
<add input="{QUERY_STRING}" pattern="fdl=1" />
</conditions>
</rule>
</outboundRules>
</rewrite>
</system.webServer>
</configuration>
EDITAR (10/4/2016):
Parece que el atributo de download aún no está completamente adoptado por todos los navegadores.
Para una implementación basada en JavaScript / navegador, puede consultar FileSaver.js que es un polyfill para guardar la funcionalidad en los navegadores que no lo admiten. Aunque no tiene una cobertura perfecta.
En Firefox y Chrome, esta propiedad de enlace "download = img.jpg" funciona bien y muestra la ventana de descarga en lugar de una nueva pestaña o página.
<a href="img.jpg" download="img.jpg">Download Image</a>
Pero en Safari e IE este enlace me da una nueva página.
Entonces, ¿qué es un flujo de trabajo simple y efectivo para manejar esto con los navegadores Safari e IE?
Esta es una forma de hacerlo en IE con JavaScript. Sin embargo, todavía no puedo encontrar una solución para Safari.
var canvas = document.createElement(''canvas'');
var img = document.createElement(''img'');
img.onload = function(e) {
canvas.width = img.width;
canvas.height = img.height;
var context = canvas.getContext(''2d'');
context.drawImage( img, 0, 0, img.width, img.height);
window.navigator.msSaveBlob(canvas.msToBlob(),''image.jpg'');
}
img.src = ''img.jpg;
Lo más fácil es usar un lenguaje del lado del servidor como PHP. Realmente se analiza con mayor profundidad en esta página, incluido un código de prueba para manipular encabezados y demás. Desafortunadamente, estas son las únicas soluciones hasta que IE y Safari se pongan al día.
Refrencia:
navigator.msSaveBlob(blob, filename)
https://msdn.microsoft.com/sv-se/library/windows/apps/hh772331
Desafortunadamente no conozco una forma de hacerlo en Safari.