緩存圖像jquery/javascript globaly

Question

我有一個基於ASP.NET MVC的網站管理數據庫內容並生成RSS文件與View。但對於輸出，可以使用簡單的靜態HTML頁巫下載內容與js文件代碼中自爆：

$.get(RssRoot + '/instruments',function(datas){ 
$('item',datas).each(function(i) { 
    var name = $(this).find("name").text(); 
    var thumbnail = $(this).find("thumbnail").text(); 
    var id = $(this).find("id").text(); 
    var href = Root + '/instrument.html?id=' + id; 
    $("#instrument").append('<a href="' + href + '"><img title="' + name + '" class="image" src="' + thumbnail + '" /></a>'); 
}); 
}); 

縮略圖使用此代碼生成：

public async Task<ActionResult> Instrument(Guid? Id = null) 
{ 
    if (Id == null) return HttpNotFound(); 
    return File(db.Instruments.Find(Id).Thumbnail, "image/png"); 
} 

你可以看到圖像不能ftp文件。他們正在從數據庫加載。例如，對於瀏覽器的縮略圖url：~/Thumbs/Instruments/fdbc870e-87a4-4d6e-befa-027af647f4ca

正如你現在，因爲這種方式有一個像lazy loading行爲，我用它。但它有一些問題，例如每次下載圖像。如何在瀏覽器中緩存圖像以備下次使用？

注：我知道有很多插件可用;但是因爲我的項目並不像我說的那麼標準，所以這個挑戰就在於它。

爲什麼？我想減少我的數據庫服務器流量。

Answer 1

如果您希望提高性能，請考慮將項目添加到web.config的<system.webserver>節點。這些將啓用對象壓縮和緩存靜態對象7天：

<httpCompression directory="%SystemDrive%\inetpub\temp\IIS Temporary Compressed Files"> 
      <scheme name="gzip" dll="%Windir%\system32\inetsrv\gzip.dll" /> 
      <dynamicTypes> 
       <add mimeType="text/*" enabled="true" /> 
       <add mimeType="message/*" enabled="true" /> 
       <add mimeType="application/javascript" enabled="true" /> 
       <add mimeType="application/javascript; charset=utf-8" enabled="true" /> 
       <add mimeType="application/x-javascript" enabled="true" /> 
       <add mimeType="*/*" enabled="false" /> 
      </dynamicTypes> 
      <staticTypes> 
       <add mimeType="text/*" enabled="true" /> 
       <add mimeType="message/*" enabled="true" /> 
       <add mimeType="application/javascript" enabled="true" /> 
       <add mimeType="application/javascript; charset=utf-8" enabled="true" /> 
       <add mimeType="application/x-javascript" enabled="true" /> 
       <add mimeType="*/*" enabled="false" /> 
      </staticTypes> 
     </httpCompression> 
     <httpProtocol allowKeepAlive="true"> 
     </httpProtocol> 
     <staticContent> 
      <clientCache cacheControlCustom="public" cacheControlMode="UseMaxAge" cacheControlMaxAge="7.00:00:00" /> 
      <!-- IF PAGE STOPS LOADING CORRECTLY, REMOVE THE FOLLOWING MIME TYPE DEFINITIONS TO DEBUG --> 
      <mimeMap fileExtension=".otf" mimeType="font/otf" /> 
      <mimeMap fileExtension=".woff" mimeType="font/x-woff" /> 
     </staticContent>