您好,登錄后才能下訂單哦!
我們先來簡單看看我們熟悉的ASP.NET MVC中是如何管理我們項目中的這些靜態文件呢?
其實當我們新建一個MVC的項目時,已經生成了一個“模板”讓我們參考,
這個“模板”就是App_Start下面的 BundleConfig.cs
1 public class BundleConfig 2 { 3 // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862 4 public static void RegisterBundles(BundleCollection bundles) 5 { 6 bundles.Add(new ScriptBundle("~/bundles/jquery").Include( 7 "~/Scripts/jquery-{version}.js")); 8 bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include( 9 "~/Scripts/jquery.validate*"));10 // Use the development version of Modernizr to develop with and learn from. Then, when you're11 // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.12 bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(13 "~/Scripts/modernizr-*"));14 bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(15 "~/Scripts/bootstrap.js",16 "~/Scripts/respond.js"));17 bundles.Add(new StyleBundle("~/Content/css").Include(18 "~/Content/bootstrap.css",19 "~/Content/site.css"));20 }21 }
其中的ScriptBundle和StyleBundle分別是用于管理js和css的類,這兩個類都是繼承了Bundle這個類!
它位于System.Web.Optimization程序集,如果想要用這個功能,記得添加引用喔!
那我們要怎么使用這個呢?
現在假設在根目錄下面有css和js兩個文件夾,里面分別存放著Style1.css、Style2.css和js1.js、js2.js
下面就來看看怎么把它交于Bundle管理
1 bundles.Add(new ScriptBundle("~/bundles/js").Include(2 "~/js/js1.js",3 "~/js/js2.js"));4 bundles.Add(new StyleBundle("~/bundles/css").Include(5 "~/css/Style1.css",6 "~/css/Style2.css"));
其中的“~/bundles/js”和"~/bundles/css"是虛擬路徑!
然后就是在頁面中使用(就是用我們剛才的虛擬路徑)
1 @Styles.Render("~/bundles/css")2 @Scripts.Render("~/bundles/js")
是不是很方便呢!更多關于Bundle的內容可以參考
http://www.asp.net/mvc/overview/performance/bundling-and-minification
因為它不是我們今天的主要內容,只是拿來與Nancy中的靜態文件處理形成對比,便于我們的理解。
下面就來看看Nancy中的靜態文件怎么處理。
為了演示的方便,這里僅使用css。
先看看具體的使用,然后再簡單分析其內部的實現。
在這個應用程序中添加我們需要的引用,這里可以根據前面介紹的,
按自己喜歡的方式、方法來添加Nancy相關的引用
老規矩:Modules文件夾、HomeModule.cs
1 public class HomeModule : NancyModule 2 { 3 public HomeModule() 4 { 5 Get["/"] = _ => 6 { 7 return View["index"]; 8 }; 9 10 Get["/default"] = _ =>11 {12 return View["default"];13 };14 15 Get["/custom"] = _ =>16 {17 return View["custom"];18 };19 20 Get["/other"] = _ =>21 {22 return View["other"];23 };24 25 Get["/sub"] = _ =>26 {27 return View["sub"];28 };29 }30 }
content下面的sytle.css內容如下
1 body {background-color:#00ffff;}2 p {font-size:xx-large; }
assets和other下面的style.css內容如下
1 body {background-color:#00ffff;}2 p {font-size:xx-large;color:#ff0000;}
assets/sub下面 的style.css內容如下
1 body {background-color:#808080;}2 p {font-size:xx-large;color:#ff0000;}
老規矩:Views文件夾、Home文件夾
添加 index.html、default.html、custom.html、other.html、sub.html 五個頁面
index.html
default.html
custom.html
other.html
sub.html
新建DemoBootstrapper.cs,使其繼承DefaultNancyBootstrapper并且override我們的ConfigureConventions
1 public class DemoBootstrapper : DefaultNancyBootstrapper2 {3 protected override void ConfigureConventions(NancyConventions nancyConventions)4 {5 base.ConfigureConventions(nancyConventions);6 nancyConventions.StaticContentsConventions.Add(StaticContentConventionBuilder.AddDirectory("assets"));7 }8 }
1、default.html 用的樣式是在content下面的,能正常加載樣式!
2、custom.html用的樣式是在assets下面的,能正常加載樣式!
3、other.html用的樣式是在other下面的,不能正常加載樣式!!
4、sub.html用的樣式是在assets/sub下面的,能正常加載樣式!
很明顯,結果有點出乎我們的意料,我們在Convetion的配置中,只配置了一項!
就是對assets文件夾進行了處理。其他都沒有手動配置!
但是在content下面的樣式是能夠正常顯示的!!而other下面的是不能正常顯示的!!assets的子文件夾sub的樣式也正常顯示!!
這個給人貌似不是很合理的感覺。
看看Network的內容會發現other下面的樣式表不是不能正常加載那么簡單,而是直接給個404!!!
那我們就深入的去看看這里面到底發生了什么事吧!
fork一份Nancy的源碼,clone到本地,來看看個所以然。(其實上面的例子我就是在源碼上面添加的一個Demo)
首先看看我們今天的主題Conventions下面的東西
其中從名字就可以看出跟我們今天的主題靜態文件,相關的就有7個!!
但這并不是我們的出發點,我們的出發點是下面這個!
1 protected override void ConfigureConventions(NancyConventions nancyConventions)2 {3 base.ConfigureConventions(nancyConventions);4 nancyConventions.StaticContentsConventions.Add(StaticContentConventionBuilder.AddDirectory("assets"));5 }
Convention的配置指引著我們要先去看看NancyConvetions這個類
在其構造方法中調用了 BuildDefaultConventions 這個方法
1 /// <summary>2 /// Initializes a new instance of the <see cref="NancyConventions"/> class.3 /// </summary>4 public NancyConventions()5 {6 this.BuildDefaultConventions();7 }
這就很明顯的告訴我們,無論如何,它都會有默認的Conventions!!而且看了里面的實現
會發現,默認的Convention還不僅僅是一個!!而是包含多個。這里我們僅探討關于靜態文件的。
1 private void BuildDefaultConventions() 2 { 3 var defaultConventions = 4 AppDomainAssemblyTypeScanner.TypesOf<IConvention>(ScanMode.OnlyNancy); 5 this.conventions = defaultConventions 6 .Union(AppDomainAssemblyTypeScanner.TypesOf<IConvention>(ScanMode.ExcludeNancy)) 7 .Select(t => (IConvention)Activator.CreateInstance(t)); 8 foreach (var convention in this.conventions) 9 {10 convention.Initialise(this);11 }12 }
現在我們就該去找關于靜態文件的默認Convetion
發現剛才的7個相關中,有一個DefaultStaticContentsConventions
它實現了IConvention接口(Nancy中基本都是接口化編程,很Nice!!)。
其中的初始化方法中
1 public void Initialise(NancyConventions conventions)2 {3 conventions.StaticContentsConventions = new List<Func<NancyContext, string, Response>>4 {5 StaticContentConventionBuilder.AddDirectory("Content")6 };7 }
是不是跟我們自定義配置幾乎相差無幾!!我想看到AddDirectory的參數"Content",大家也應該都知道了
為什么我們的content下面的樣式,沒有配置都能正常加載(我去,它默認都是content,能不正常加載么。。)
里面的StaticContentConventionBuilder又是何方神圣呢?
這個是靜態基于目錄的幫助類
里面有兩個主要的方法 AddDirectory和AddFile ,都是返回Func<NancyContext, string, Response>類型的東東。
看名字都已經知道大概實現了什么東西,一個基于某個目錄,一個基于某個單獨的文件。
這里需要注意一下這兩個方法的參數!
還有一些其他的東西是用于拼接目錄和處理Cache的。
把這幾個重要的類看了一下,是不是對這個靜態文件的默認配置也清晰了不少呢?
然后對自定義Convetion配置的理解也是類似的,所以這里就不再累贅了。
從"引導程序"的ConfigureConventions中可以知道,無論我們自定義多少個Convetion,
都是要添加到StaticContentsConventions這個集合中的。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。