打開“另存為”對話框以下載圖像

Question

我一直在各地檢查這個問題的答案，但是沒有運氣。

我想要一個按鈕或鏈接，它將打開“另存為”對話框。 簡單？

我知道我可以在新窗口/選項卡中打開圖像（如我現在所做的那樣），然后right-click, save as方法，但由於使用此工具的人並不是框中最銳利的刀子，所以我想使下載盡可能簡單。

目前的代碼是：

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

但這會將圖像加載到新窗口/新選項卡中。

僅作記錄，用戶正在使用Windows XP和Internet Explorer 8，因此我們無法使用HTML5 download事件。

我不在乎它的JavaScript，JQuery還是經典的ASP。

先謝謝您的幫助。

鉛含量

更新

使用Lankymart發布的MDN代碼，我按原樣嘗試並且可以正常工作（用於Excel文檔的打開/下載），但是，我嘗試更改零件以下載圖像，但是它不起作用。

這是經典的ASP代碼：

<%
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
%>

和（嚴重）更改的MDN代碼：

<%
'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
%>

我稱它為：

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

它產生的錯誤是：

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

頁面代碼是：

<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>

Answer 1

您可以創建一個指向鏈接的按鈕，該鏈接將圖像作為文件返回，並且它將自動顯示保存選項，而不是導航到另一頁。

在服務器端，將mime類型指定為application / octect-stream

Answer 2

更新 -與問題中的評論相關

您可能還會發現需要包括

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

阻止某些瀏覽器無法驗證有效負載。 同樣重要的是，如果不確定使用， ContentType匹配發送的內容

Response.Content = "application/octet-stream"

無法通過javascript從瀏覽器啟動“另存為”對話框，但是您可以通過在Content-Disposition HTTP標頭中設置attachment值來偽造瀏覽器以顯示“另存為”對話框。

我解決這個問題的方法是使用ASP頁面生成可以使用的圖像（通過COM組件，ADODB.Stream，數據庫Blob等）；

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

這將強制保存圖像，而不是內聯顯示。 因此，使用這樣的腳本，您可以向其傳遞一個querystring值以內聯顯示（查看圖像時），並向其中傳遞一個查詢字符串值以強制其作為附件，這將強制“另存為”對話框（瀏覽器行為可能會略有不同）。

流到瀏覽器

使用ADODB.Stream對象將文件輸出到瀏覽器。

使用ASP而不是.NET返回圖像 （StackOverflow）

如何使用ADODB.Stream對象通過ASP將二進制文件發送到瀏覽器 （Microsoft支持） 。

過去，我是使用javascript啟動“另存為”對話框的（但是沒有阻止您使用HTML錨標記在沒有任何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";

因為響應作為附件返回，所以位置實際上不會更改，並且“另存為”對話框將立即顯示，並在文件名框中顯示從Content-Disposition HTTP標頭傳遞來的文件名。

打開“另存為”對話框以下載圖像

問題描述

2 個解決方案

解決方案1
2 2014-03-24 14:26:54

解決方案2
2 2014-03-24 14:34:02

打開“另存為”對話框以下載圖像

問題描述

2 個解決方案

解決方案1 2 2014-03-24 14:26:54

解決方案2 2 2014-03-24 14:34:02

解決方案1
2 2014-03-24 14:26:54

解決方案2
2 2014-03-24 14:34:02