咱們在優化Web服務的時候,對於靜態的資源文件,一般都是經過客戶端緩存、服務器緩存、CDN緩存,這三種方式來緩解客戶端對於Web服務器的鏈接請求壓力的。css
本文指在這三個方面,在ASP.NET Core中靜態文件的實現過程和使用方法進行闡述。固然也能夠考慮使用反向代理的方式(例如IIS或Nginx),這些不是本文討論的內容。git
本文重點展現如何經過StaticFileMiddleware中間件,提升網站的性能。雖然這不是惟一緩存文件的方式,咱們還能夠經過ResponseCacheAttribute特性爲ASP.NET Core Mvc的Controller和Action進行緩存的設置。github
當建立一個ASP.NET Core的項目時,查看Startup.Configure方法,就會看到默認模板生成的添加StaticFileMiddleware中間件的方法。ajax
public void Configure(IApplicationBuilder app) { // looging and exception handler removed for clarity app.UseStaticFiles(); app.UseMvc(routes => { routes.MapRoute( name: "default", template: "{controller=Home}/{action=Index}/{id?}"); }); }
這樣就使你的應用程序可以處理,程序目錄下wwwroot目錄的靜態文件內容。在咱們添加文件緩存以前,咱們先要看一下StaticFileMiddleware默認的策略是怎麼樣的。當第一次加載程序時,瀏覽器將打開頁面並下載全部的資源鏈接。假如頁面沒有錯誤返回都是正確那麼就是返回文件數據和Http Status爲200 -OK的狀態。bootstrap
而後咱們看下這個Http請求對應的Response Header,這裏會包含ETag和Last-Modified兩個值。HTTP內容以下:瀏覽器
HTTP/1.1 200 OK Date: Sat, 15 Oct 2016 14:15:52 GMT Content-Type: image/svg+xml Last-Modified: Sat, 15 Oct 2016 13:43:34 GMT Accept-Ranges: bytes ETag: "1d226ea1f827703" Server: Kestrel
若是再次請求這個地址的話,瀏覽器將發送ETag和Last-Modified的值到服務端,若是兩個值沒有變化,那麼服務端會發送304狀態到瀏覽器,那麼瀏覽器將使用以前的資源而不是從新下載一份。緩存
這樣就提升了,瀏覽器的響應性能,由於文件都緩存到了客戶端,而且經過304狀態,服務端與瀏覽器的請求流量得以減小。服務器
固然咱們都知道若是要設置某一請求的緩存,只須要設置Header爲Cache-Control的值。那麼在StaticFileMiddleware中間件中,咱們怎麼設置這個Header呢?app
using Microsoft.Net.Http.Headers; app.UseStaticFiles(new StaticFileOptions { OnPrepareResponse = ctx => { const int durationInSeconds = 60 * 60 * 24; ctx.Context.Response.Headers[HeaderNames.CacheControl] = "public,max-age=" + durationInSeconds; } });
設置後每個靜態文件的請求都會執行這個方法,包括200和304狀態的請求;並且在這個例子裏瀏覽器會自動緩存這些文件24小時,可是在此期間並不會返回404狀態。ide
一旦max-age設置的時間過時,瀏覽器就不會再使用本地緩存,而去直接請求服務器端。這樣已經避免了一些額外的請求到服務器端了。若是咱們在瀏覽器與服務器中間使用CDN緩存文件數據的話,這樣就算客戶端瀏覽器的緩存過時了,可是請求也不會到咱們的服務器上,而是請求到CDN緩存服務器。
下面咱們看看文件緩存在ASP.NET Core中是如何判斷緩存失效的?.NET Core開源的代碼爲咱們提供了了解它的入口【代碼 Source Code】。核心代碼以下:
_length = _fileInfo.Length; DateTimeOffset last = _fileInfo.LastModified; // Truncate to the second. _lastModified = new DateTimeOffset(last.Year, last.Month, last.Day, last.Hour, last.Minute, last.Second, last.Offset).ToUniversalTime(); long etagHash = _lastModified.ToFileTime() ^ _length; _etag = new EntityTagHeaderValue('\"' + Convert.ToString(etagHash, 16) + '\"');
服務器端若是檢測到文件改變就會返回200狀態給瀏覽器,若是沒有變化則返回304狀態給瀏覽器端。
不幸的是,一旦咱們添加了緩存,瀏覽器將再也不向服務器發出請求。該文件可能已經徹底改變或已被徹底刪除,但若是瀏覽器不要求,服務器將不能通知瀏覽器從新發起無緩存的請求!
一般咱們都使用形如https://localhost/js/site.js?v=1 這樣的地址來解決緩存的問題。經過給靜態文件生成惟一的版本號,作爲QueryString進行請求時,服務器將從新輸出文件內容。
在ASP.NET Core中Tag Hepers爲咱們提供了這樣的API:
<script src="~/js/site.js" asp-append-version="true"></script>
這段代碼最終在瀏覽器端會被渲染爲以下Html代碼:
<script src="/js/site.js?v=Ynfdc1vuMNOWZfqTj4N3SPcebazoGXiIPgtfE-b2TO4"></script>
若是靜態文件發生改變,Tag Helper就是從新計算文件的哈希值,它採用 SHA256的哈希值。固然之前服務器緩存的文件版本也隨之失效了。這個asp-append-version Tag Helper能夠支持Img、Script和Link元素。
ASP.NET Core的源代碼咱們來看看是怎麼計算文件變化的:【源代碼 Source Code】 。
咱們在使用CDN時,由於還要進行開發任務,通常咱們都要有兩套地址,一套是CDN上的文件地址,一套是本地調試開發用的地址。ASP.NET Core中也爲咱們提供了Tag Helper來解決這樣的問題。直接上代碼實例吧:
<link rel="stylesheet" href="//ajax.aspnetcdn.com/ajax/bootstrap/3.0.0/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/css/bootstrap.min.css" asp-fallback-test-class="hidden" asp-fallback-test-property="visibility" asp-fallback-test-value="hidden" /> <script src="//ajax.aspnetcdn.com/ajax/bootstrap/3.0.0/bootstrap.min.js" asp-fallback-src="~/lib/bootstrap/js/bootstrap.min.js" asp-fallback-test="window.jQuery"> </script>
Tag Helper:asp-fallback-* 解決開發時使用的文件地址問題。 固然它也能夠asp-append-version 兩個Tag Helper一塊兒使用,這樣就實現了,在CDN文件緩存的同步問題。
新的ASP.NET Core爲咱們提供了不少現有互聯網行業的解決方案,也給.NET開發人員引入了先進思想。
GitHub:https://github.com/maxzhang1985/YOYOFx 若是覺還能夠請Star下, 歡迎一塊兒交流。
.NET Core 和 YOYOFx 的交流羣: 214741894