跟我一起学习ASPNET4.5 MVC4.0(六).doc

跟我一起学习ASP.NET 4.5 MVC4.0（六）这一系列文章跨度有点大，由于最近忙于其他事情，没有更新，今天重新安装了下Win8系统，VS2012和SQLServer 2012，顺便抽空继续一篇。随着VS2012 RC版本的放出，ASP.NET MVC4.0也随之有所改变，主要相对于BETA版本。前面几章节都是介绍MVC4.0或者是3.0中内容，今天我们来了解一下WebPage 2.0下面的一些变化。在MVC3.0中使用的是WebPage 1.0版本，这里主要是介绍一下在MVC4.0中对脚本以及样式表的引用变化等等。 一、可以直接使用“”，而无需使用Href对象实例这个是一大变化，给我们ASP.NET MVC开发人员带来了很便捷的代码书写方式，提高不少效率。在MVC3.0中加入我们需要加入一张图片时，需要在IMG标签的SRC属性加上Url.Content或Href对象方法等来对路径进行解析。在WebPage 2.0中Razor模板引擎能够自动解析基于根目录的路径，即可以直接使用“”来表示根目录。 MVC3：Home MVC4：Home 二、CheckBox等可以根据Value自动隐藏checked属性 在以前初始化一个CheckBox是否被选中，都需要额外写一个方法来判断是否在INPUT的CheckBox中加入checked属性。在MVC4.0中这个将被改变，这也是一个很赞的改进，具体可以看如下代码。MVC3： 1 input type=checkbox2 name=check13 value=check14 if(checked1)checked=checked1 /MVC4： 1 只要checked1变量为false或null，将会隐藏checked属性，是不是一个很好的改进！ 三、使用System.Web.Optimization对脚本和样式表的操作这个也是本章重点向描述的部分，首先我们可以使用VS2012RC来新建一个MVC4.0项目，版本可以为4.0或4.5。在Global.asax文件代码中，我们发现已经把过滤器，路由器，以及对样式表和脚本捆绑（Bundles）移到了其他页面，就是在根目录下的App_Start文件夹内。代码只是简简单单的几行，代码如下： 1 using System; 2 using System.Collections.Generic; 3 using System.Configuration; 4 using System.Data.Entity; 5 using System.Data.Entity.Infrastructure; 6 using System.Linq; 7 using System.Web; 8 using System.Web.Http; 9 using System.Web.Mvc;10 using System.Web.Optimization;11 using System.Web.Routing;12 13 namespace MVC414 15 / Note: For instructions on enabling IIS6 or IIS7 classic mode, 16 / visit /?LinkId=939480117 18 public class MvcApplication : System.Web.HttpApplication19 20 protected void Application_Start()21 22 AreaRegistration.RegisterAllAreas();23 24 FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);25 RouteConfig.RegisterRoutes(RouteTable.Routes);26 BundleConfig.RegisterBundles(BundleTable.Bundles);27 28 29 而在App_Start目录下多了3个文件，他们分别是RilterConfig.cs，RouteConfig.cs以及BundleConfig.cs文件。在BETA版本中还是直接写在Global.asax文件中，从名称上就可以知道他们各自的功能，今天我们主要了解BundleConfig.cs文件的内容和功用。 在BundleConfig.cs文件中，包含了一些应用程序中使用的脚本和样式表的文件路径，其中可以使用通配符，具体代码如下所示： 1 using System.Web; 2 using System.Web.Optimization; 3 4 namespace MVC4 5 6 public class BundleConfig 7 8 public static void RegisterBundles(BundleCollection bundles) 9 10 bundles.Add(new ScriptBundle(/bundles/jquery).Include(11 /Scripts/jquery-1.*);12 13 bundles.Add(new ScriptBundle(/bundles/jqueryui).Include(14 /Scripts/jquery-ui*);15 16 bundles.Add(new ScriptBundle(/bundles/jqueryval).Include(17 /Scripts/jquery.unobtrusive*,18 /Scripts/jquery.validate*);19 20 bundles.Add(new ScriptBundle(/bundles/modernizr).Include(21 /Scripts/modernizr-*);22 23 bundles.Add(new StyleBundle(/Content/css).Include(/Content/site.css);24 25 bundles.Add(new StyleBundle(/Content/themes/base/css).Include(26 /Content/themes/base/jquery.ui.core.css,27 /Content/themes/base/jquery.ui.resizable.css,28 /Content/themes/base/jquery.ui.selectable.css,29 /Content/themes/base/jquery.ui.accordion.css,30 /Content/themes/base/jquery.ui.autocomplete.css,31 /Content/themes/base/jquery.ui.button.css,32 /Content/themes/base/jquery.ui.dialog.css,33 /Content/themes/base/jquery.ui.slider.css,34 /Content/themes/base/jquery.ui.tabs.css,35 /Content/themes/base/jquery.ui.datepicker.css,36 /Content/themes/base/gressbar.css,37 /Content/themes/base/jquery.ui.theme.css);38 39 40 这些都是关于Bundle的应用，从代码中就可以看到，Bundle实例对象（Script和Style）中包含一个虚拟目录，这个目录可以在页面中使用时作为唯一键引入。当然在实现优化时，这个虚拟目录将呈现在前台页面中，这个后面将继续讲述。下面我们来看一下在代码中如何使用他们，在System.Web.Optimization程序集中包含了Scripts和Styles两个类，分别用于呈现Bundle集合中的脚本和样式表，代码如下：1 Styles.Render(/Content/themes/base/css, /Content/css)2 Scripts.Render(/bundles/modernizr)从上面就可以看出，往页面中引入了两个捆绑的样式表和一个脚本，这些引入是包含了所有Include方法内的文件，调试一下看看前台HTML代码就知道了。而他们中的另一个方法Url则是对外部文件的引入，例如CDN中的文件，如：Google等等API文件。 四：对样式表和脚本的优化这项其实也是包含在三中的，我独立出来，最主要感觉是我觉得他是个不错的家伙。代码简单，但是非常的适用，不知道大家有没有使用过AjaxMinify这个东东，可以把脚本编译，压缩成最小的内容。不过都是要使用命令的，然而在MVC4.0中System.Web.Optimization已经包含了这个东东，他们就是JsMinify和CssMinify，不要小看这两个类，虽然公开的方法就两个。按照上述方法是用Scripts和Styles将脚本和样式表引入页面时，无需修改任何代码就可以将脚本和样式表编译压缩输入到客户端，这样不仅可以有效的增加JSHack的难度以及降低文件的大小。为了达到这个目的，我们只需要将BundleTable中的一个属性设置为true即可，代码如下： 1 using System; 2 using System.Collections.Generic; 3 using System.Configuration; 4 using System.Data.Entity; 5 using System.Data.Entity.Infrastructure; 6 using System.Linq; 7 using System.Web; 8 using System.Web.Http; 9 using System.Web.Mvc;10 using System.Web.Optimization;11 using System.Web.Routing;12 13 namespace MVC414 15 / Note: For instructions on enabling IIS6 or IIS7 classic mode, 16 / visit /?LinkId=939480117 18 public class MvcApplication : System.Web.HttpApplication19 20 protected void Application_Start()21 22 AreaRegistration.RegisterAllAreas();23 24 FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);25 RouteConfig.RegisterRoutes(RouteTable.Rou