且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

打开"另存为"对话框要下载图片

更新时间:2022-12-09 13:00:22

更新 - 在问题相关的意见

您也可以找到你需要包括

  Response.AddHeader(Content-Length的LENB(yourbinary))

要从未能验证有效载荷阻止一些浏览器。另外很重要的在的ContentType 匹配,如果你不确定使用

什么是发送
  Response.Content =应用程序/八位字节流


有没有办法从浏览器启动另存为对话框通过JavaScript,但你可以伪造浏览器进入由设置附件值显示另存为对话框内容处置 HTTP标头。

我已经解决这个问题的方法是使用一个ASP页面生成图像(通过COM组件的ADODB.Stream,数据库的blob等),这样你可以使用;

  Response.AddHeader(内容处置,附件;文件名= myImage.jpg这个参数)

这将迫使图像进行保存,而不是内嵌显示。因此,与这样的脚本,您可以传递一个查​​询字符串值,其显示嵌入式(查看影像时),一个以迫使它作为附件,这将迫使另存为对话框(浏览器的行为可能略有不同)。


  

流的浏览器


  
  

使用的ADODB.Stream 对象文件输出到浏览器。


  
  
块引用>

在过去,我使用javascript启动另存为对话框(但没有什么用HTML锚标记做同样的事情阻止你不需要任何JavaScript);

  / *
传递myimageid被识别图像的一种方式,返回
无论是数据库或文件系统的查找。
* /
window.location.href =/myimage.asp?id=myimageid&display=attachment;

由于作为与从传递的文件的名称立即显示对话框中的响应作为附件的位置从来没有真正改变和拯救内容处置 HTTP头中的文件名框中。

I've been checking all over the place for an answer to this one but no luck.

I want a button or link that will open the "Save As" dialog box. Simple?

I know I can open the image in a new window/tab (as I'm doing now) and then use the right-click, save as method but as the people using this are not the sharpest knives in the box, so I want to make the download as simple as possible.

The code at the moment is:

<button class="downloadButton" type="submit" onClick="window.open('<%=(rsContent.Fields.Item("ContentImage").Value)%>')">Download Image</button>

but this loads the image into a new window/new tab.

Just for the record, the users are using Windows XP with Internet Explorer 8 so we can't use the download HTML5 event.

I don't mind if its JavaScript, JQuery or classic ASP.

Thanks in advance for the help.

Pb

UPDATE

Using the MDN code Lankymart posted, I tried as-is and it worked (for the open/download of an Excel document), however, I tried changing parts to download images and it didn't work.

Here is the Classic ASP code:

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

Set rsImage_cmd = Server.CreateObject ("ADODB.Command")
rsImage_cmd.ActiveConnection = MM_ENG_STRING
rsImage_cmd.CommandText = "SELECT ContentID, ContentImage, DisplayImage FROM tblContent WHERE ContentImage = ?" 
rsImage_cmd.Prepared = true
rsImage_cmd.Parameters.Append rsImage_cmd.CreateParameter("param1", 5, 1, -1, rsImage__imageID) ' adDouble

Set rsImage = rsImage_cmd.Execute
rsImage_numRows = 0
%>

and the (badly) altered MDN code:

<%
'Set the content type to the specific type that you are sending.
Response.ContentType = "image/JPEG"

Const adTypeBinary = 1
Dim strImageFile

strImageFile = (rsImage.Fields.Item("ContentImage").Value) 'This is the path and name of the file on disk. 

Set objStream = Server.CreateObject("ADODB.Stream")
objStream.Open
objStream.Type = adTypeBinary
objStream.LoadFromFile strImageFile

Response.BinaryWrite objStream.Read

objStream.Close
Set objStream = Nothing
%>

I call it using:

<button class="downloadButton" type="submit" onClick="window.location.href='image-download.asp?imageID=<%=(rsContent.Fields.Item("ContentID").Value)%>';">Download Image</button>

The error it produces is:

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

The page code is:

<html>

    <head>
        <meta name="viewport" content="width=device-width; height=device-height;"></meta>
        <link rel="stylesheet" href="resource://gre/res/ImageDocument.css"></link>
        <link rel="stylesheet" href="resource://gre/res/TopLevelImageDocument.css"></link>
        <link rel="stylesheet" href="chrome://global/skin/media/TopLevelImageDocument.css"></link>
        <title>

            image-download.asp (JPEG Image)

        </title>
    </head>
    <body>
        <img src="http://localhost:85/admin/english/image-download.asp?imageID=5" alt="The image "http://localhost:85/admin/english/image-download.…p?imageID=5" cannot be displayed because it contains errors." title=""></img>
    </body>

</html>

Update - Related to comments in the question

You may also find you need to include

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

To stop some browsers from failing to validate the payload. Also it's important the the ContentType matches what is sent if you are unsure use

Response.Content = "application/octet-stream"


There is no way to initiate the Save As Dialog from the browser via javascript but you can fake the browser into displaying the Save As dialog by setting the attachment value in the Content-Disposition HTTP header.

The way I've tackled this is use a ASP page to generate the image (via COM component, ADODB.Stream, database blob etc) that way you can use;

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

This will force the image to be saved rather than displayed inline. So with a script like this you can pass one querystring value to it to display inline (when viewing the image) and one to force it as an attachment which will force the Save As dialog (browser behaviour may be slightly different).

Streaming to the Browser

Using the ADODB.Stream object to output files to the browser.

In the past I've initiated the Save As dialog using javascript (but there is nothing stopping you using a HTML anchor tag to do the same thing without any 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";

Because the response comes back as an attachment the location is never actually changed and the Save As dialog is displayed immediately with the name of the file passed from the Content-Disposition HTTP header in the file name box.