来自  资质荣誉 2019-09-25 08:30 的文章
当前位置: 澳门太阳娱乐手机登录 > 资质荣誉 > 正文

Nancy之静态文件管理

后天大家来谈谈南茜中的静态文件(JavaScript,CSS等)该怎么管理。

在前边的德姆o中,大家也已经使用了这一块的源委,

但并不曾尖锐精晓,只是停留在接纳的范围上。

在走入明天的大旨从前,大家先来回顾看看我们熟练的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"));  

其中的“~图片 1/bundles/js”和"~/bu图片 2ndles/css"是虚构路径!然后正是在页面中接纳(便是用我们刚刚的设想路线)

1  @Styles.Render("~/bundles/css")2  @Scripts.Render("~/bundles/js")  

是否很便利啊!越多关于Bundle的内容能够参照

因为它不是我们今天的要紧内容,只是拿来与Nancy中的静态文件管理产生对照,便于我们的敞亮。

下边就来拜会Nancy中的静态文件怎么处理。

为了演示的有利,这里仅使用css。

先看看实际的行使,然后再轻松深入分析其里面包车型地铁落实。

一、新建三个空的asp.net应用程序

在这几个应用程序中增多大家必要的引用,这里能够依据前边介绍的,

按自个儿喜好的方式、方法来增添南希相关的引用

二、建立Modules

老规矩: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、assets、other多个文本夹,以及在assets文件夹上边新建二个sub文件夹用于寄存样式表

四、分别增多一些简便的体制在那个文件夹中

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

老规矩:Views文件夹、Home文件夹

增多index.html、default.html、custom.html、other.html、sub.html 八个页面

图片 3图片 4

 1 <!DOCTYPE html> 2 <html> 3 <head> 4     <title>index</title> 5     <meta charset="utf-8" /> 6 </head> 7 <body> 8     <a href="/default">page with default convention</a><br /> 9     <a href="/custom">page with custom convention</a><br />10     <a href="/other">page without custom convention</a><br />11     <a href="/sub">page sub</a>12 </body>13 </html>

index.html图片 5图片 6

 1 <!DOCTYPE html> 2 <html> 3 <head> 4     <title>default</title> 5     <meta charset="utf-8" /> 6     <link href="../../content/style.css" rel="stylesheet" /> 7 </head> 8 <body> 9    <p>这是引用 /content/sytle.css 的页面(默认的convention配置)</p>10 </body>11 </html>

default.html图片 7图片 8

 1 <!DOCTYPE html> 2 <html> 3 <head> 4     <title>custom</title> 5     <meta charset="utf-8" /> 6     <link href="../../assets/style.css" rel="stylesheet" /> 7 </head> 8 <body> 9    <p>这是引用 /assets/style.css 的页面(自定义Convention配置)</p>10 </body>11 </html>

custom.html图片 9图片 10

 1 <!DOCTYPE html> 2 <html> 3 <head> 4     <title>other</title> 5     <meta charset="utf-8" /> 6     <link href="../../other/style.css" rel="stylesheet" /> 7 </head> 8 <body>    9     <p>这是引用 /other/style.css 的页面(没有Convention配置)</p>10 </body>11 </html>

other.html图片 11图片 12

 1 <!DOCTYPE html> 2 <html> 3 <head> 4     <title>sub</title> 5     <meta charset="utf-8" /> 6     <link href="../../assets/sub/style.css" rel="stylesheet" /> 7 </head> 8 <body> 9    <p>这是引用 /assets/sub/style.css 的页面(自定义Convention配置,子文件夹测试)</p>10 </body>11 </html>

sub.html

六、在"带领程序"中配置Convention

新建德姆oBootstrapper.cs,使其继续Default南茜Bootstrapper况且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     }  

七、运营结果

图片 13

八、结果分析与研商

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

图片 14

那我们就深入的去探望这些中毕竟发生了什么事呢!

fork一份南希的源码,clone到本地,来拜望个所以然。(其实上边的例子小编便是在源码上边添加的三个德姆o)

率先探望大家先天的大旨Conventions上边包车型大巴事物

图片 15

中间从名字就能够看出跟我们今日的核心静态文件,相关的就有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; 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又是何方圣洁呢?

其一是静态基于目录的鼎力相助类

图片 16

当中有多个重视的措施AddDirectory和AddFile ,都是回来Func<南茜Context, string, Response>类型的东东。

看名字都曾经明白大概达成了什么样事物,一个依据某些目录,四个基于有个别单独的文件。

此处须求小心一下那个办法的参数!

再有一部分别样的事物是用以拼接目录和拍卖Cache的。

把这多少个第一的类看了刹那间,是或不是对这些静态文件的暗许配置也清楚了好些个吗?

接下来对自定义Convetion配置的知晓也是近乎的,所以这里就不再累赘了。

从"带领程序"的ConfigureConventions中得以知晓,无论我们自定义多少个Convetion,

都以要增多到StaticContentsConventions这些集结中的。

九、轻易总结

ConfigureConventions 与 BundleConfig 都以用于拍卖静态文件的,有一样之处,也某个的天性。

在类型支付进度中,我们可能会基于习贯把css、javascript这么些静态文件放在本人喜欢的职责,

不过在南希中那些的管理要求十一分注意的是,只要咱们从没将css和javascript文件放在content中时,就必将要记得在Convention中开展示公布局!

不然页面死活不是大家意在的那么。。。。

于是本人个人认为那块内容不是很团结,一旦十分大心忘了布置,并且开采页面样式不对,首先想到的是或不是体制的不二等秘书技写错了

而不会平素考虑到Nancy的Convention配置这一层面。

为此,提示各位使用Nancy的爱人,并建议各位:举例你的花色用到了静态文件,请务须求override大家的ConfigureConventions !!

本文由澳门太阳娱乐手机登录发布于 资质荣誉,转载请注明出处:Nancy之静态文件管理

关键词: