Abra el cuadro de diálogo “Guardar como” para descargar la imagen

Estuve revisando todo el lugar para encontrar una respuesta a esta, pero no tuve suerte.

Quiero un botón o enlace que abrirá el cuadro de diálogo “Guardar como”. ¿Sencillo?

Sé que puedo abrir la imagen en una nueva ventana / pestaña (como lo estoy haciendo ahora) y luego usar el método de right-click, save as , pero como las personas que usan esto no son los cuchillos más afilados de la caja, entonces quiero para hacer la descarga lo más simple posible.

El código en este momento es:

 <button class="downloadButton" type="submit" onClick="window.open('')">Download Image 

pero esto carga la imagen en una nueva ventana / nueva pestaña.

Solo para el registro, los usuarios están usando Windows XP con Internet Explorer 8 por lo que no podemos usar el evento HTML5 de download .

No me importa si es JavaScript, JQuery o ASP clásico.

Gracias de antemano por la ayuda.

Pb

ACTUALIZAR

Utilizando el código MDN publicado por Lankymart , probé como estaba y funcionó (para la apertura / descarga de un documento de Excel), sin embargo, traté de cambiar partes para descargar imágenes y no funcionó.

Aquí está el código ASP clásico:

 <% Dim rsImage__imageID rsImage__imageID = "1" If (Request.QueryString("imageID")  "") Then rsImage__imageID = Request.QueryString("imageID") End If %>  

y el código MDN (mal) alterado:

  

Lo llamo usando:

 <button class="downloadButton" type="submit" onClick="window.location.href='image-download.asp?imageID=';">Download Image 

El error que produce es:

 The image “http://localhost:85/admin/english/image-download.…p?imageID=5” cannot be displayed because it contains errors. 

El código de la página es:

        image-download.asp (JPEG Image)    The image “http://localhost:85/admin/english/image-download.…p?imageID=5” cannot be displayed because it contains errors.   

Actualización : relacionada con los comentarios en la pregunta

También puede encontrar que necesita incluir

 Response.AddHeader("Content-Length", LenB(yourbinary)) 

Para evitar que algunos navegadores validen la carga útil. También es importante que ContentType coincida con lo que se envía si no estás seguro

 Response.Content = "application/octet-stream" 

No hay forma de iniciar el cuadro de diálogo Guardar como desde el navegador mediante JavaScript, pero puede simular que el navegador muestre el cuadro de diálogo Guardar como configurando el valor del attachment en el encabezado HTTP Content-Disposition .

La forma en que he abordado esto es utilizar una página ASP para generar la imagen (a través del componente COM, ADODB.Stream, blob de base de datos, etc.) de esa manera usted puede usar;

 Response.AddHeader("Content-Disposition", "attachment;filename=myimage.jpg") 

Esto obligará a la imagen a guardarse en lugar de visualizarse en línea. Entonces, con un script como este, puede pasarle un valor de cadena de consulta para mostrarlo en línea (cuando visualiza la imagen) y otro para forzarlo como un archivo adjunto que forzará el diálogo Guardar como (el comportamiento del navegador puede ser ligeramente diferente).

Transmitiendo al navegador

Usar el objeto ADODB.Stream para generar archivos en el navegador.

  • Devuelve una imagen usando ASP, no .NET (StackOverflow)
  • Cómo utilizar el objeto ADODB.Stream para enviar archivos binarios al navegador a través de ASP (Soporte de Microsoft) .

En el pasado, he iniciado el cuadro de diálogo Guardar como mediante JavaScript (pero no hay nada que te impida usar una etiqueta de ancla HTML para hacer lo mismo sin javascript);

 /* passing myimageid is a way of identifying the image to return be it a database or file system lookup. */ window.location.href = "/myimage.asp?id=myimageid&display=attachment"; 

Debido a que la respuesta vuelve como un archivo adjunto, la ubicación nunca cambia y el cuadro de diálogo Guardar como se muestra inmediatamente con el nombre del archivo pasado del encabezado HTTP Content-Disposition en el cuadro de nombre de archivo.

Puede crear un botón que apunte a un enlace que devuelva la imagen como un archivo y mostrará la opción de guardar automáticamente en lugar de navegar a otra página.

En el lado del servidor, especifique el tipo de mime como application / octect-stream