第 5 章 MVC核心透析——ASP.NET MVC企业级实战

傷城~ 2021-06-24 16:00 424阅读 0赞

## 目录 ##

#### 5.1 MVC Routing ####

###### 5.1.1 Routing 的作用 ######

###### 5.1.2 Routing 测试 ######

#### 5.2 异步Ajax ####

###### 5.2.1 传统Ajax实现方式 ######

###### 5.2.3 AjaxHelper ·异步链接按钮 ######

###### 5.2.3 AjaxHelper ·异步表单 ######

#### 5.3 MVC Areas ####

#### 5.3.1 Area 使用入门 ####

#### 5.3.2 Area注册类放到单独的程序集 ####

--------------------

#### 5.1 MVC Routing ####

在项目要使用路由，需要添加程序集的引用System.Web.Routing.dll。

###### 5.1.1 Routing 的作用 ######

*  匹配传入的请求（不匹配服务器物理文件），并将请求映射到“控制器”的具体操作“Action方法”和“参数”中。
 *  调用并执行对应控制器类的Action方法。  
    Global.asax.cs文件中的Application\_Start()方法里面进行了路由注册：

RouteConfig.RegisterRoutes(RouteTable.Routes);

App\_Start文件夹中的RouteConfig.cs定义了路由的识别规则：

public static void RegisterRoutes(RouteCollection routes)
            {
                routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
    
                routes.MapRoute(
                    name: "Default",
                    url: "{controller}/{action}/{id}",
                    defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
                );
            }

###### 5.1.2 Routing 测试 ######

使用NuGet搜索“RouteDebugger”，安装。  
![1240][]  
Web.config中节点里面自动添加了如下配置代码：  
![1240 1][]

F5 Debug：  
![1240 2][]

#### 5.2 异步Ajax ####

###### 5.2.1 传统Ajax实现方式 ######

###### 1. JQ + 一般处理程序 ######

*  新建一个web窗体项目，然后添加一个html文件。  
    ![1240 3][]  
    html文件内容：

<!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="Scripts/jquery-1.10.2.js"></script>
        <script type="text/javascript"> $(function () { $("#btnGetDateTime").click(function () { $.post("GetDateTimeHandler.ashx", {}, function (data) { $("#divDateTime").html(data); }); }); }); </script>
    </head>
    <body>
        <input type="button" value="获取时间" id="btnGetDateTime"/>
        <div id="divDateTime"></div>
    </body>
    </html>

可以在script中看出，里面使用post的方式，从GetDateTieHandler.ashx获取data，并在div中显示出来。  
\* GetDateTimeHandler.ashx代码：

using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    
    namespace JQ_一般处理程序
    {
        /// <summary>
        /// GetDateTimeHandler 的摘要说明
        /// </summary>
        public class GetDateTimeHandler : IHttpHandler
        {
    
            public void ProcessRequest(HttpContext context)
            {
                context.Response.ContentType = "text/plain";
                context.Response.Write(DateTime.Now.ToString());
            }
    
            public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
        }
    }

*  运行Index.html  
    ![1240 4][]

###### 2. JQ + Action ######

*  添加一个controller, 并命名为ShowStringList，添加一个post方法，放回一个string列表：

using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    
    namespace JQ_Action.Controllers
    {
        public class ShowStringListController : Controller
        {
            // GET: ShowStringList
            public ActionResult Index()
            {
                return View();
            }
            [HttpPost]
            public ActionResult GetStringList()
            {
                List<string> list = new List<string> { "a","c","s","f","d","3","2" };
                System.Web.Script.Serialization.JavaScriptSerializer jss = new System.Web.Script.Serialization.JavaScriptSerializer();
                return Content(jss.Serialize(list));
            }
        }
    }

*  为该controller添加视图，并利用ajax调用该方法，将获取到的数据，逐个添加到一个div中，并显示出来，View代码：

*  运行结果：  
    ![1240 5][]

###### 5.2.2 Unobtrusive Ajax 使用方式 ######

通俗来讲，非入侵式就是将嵌入HTML中的js全部提取出来，放在单独的js中，HTML标签中不要出现任何onclick、onload等。  
  ASP.NET MVC 4 已经默认开启客户端验证和非入侵式js。在Web.config中可以看到如下配置信息：  
![1240 6][]

###### 5.2.3 AjaxHelper ·异步链接按钮 ######

(1)新建一个mvc项目，在view中，@Ajax.ActionLink创建Ajax超链接按钮，一般用来请求动态生成的部分HTML代码。

@Ajax.ActionLink("链接文本","PartialViewTest",new AjaxOptions() {
        UpdateTargetId = "divMsg",
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "Post"
    })

(2)在Controller中:

public PartialViewResult PartialViewTest()
            {
                ViewData["Msg"] = "Hello World";
                return PartialView();
            }

(3)  
生成的HTML代码如下：  
![1240 7][]  
(4)为了方便演示，再添加一个view，点击超链接，进入另一个界面:  
![1240 8][]  
(5)演示结果：  
![1240 9][]

###### 5.2.3 AjaxHelper ·异步表单 ######

（1）新建一个mvc项目，在Controller中添加如下action方法：

public ActionResult BaseInfo(string txtName)
            {
                return Content("Name : " + txtName);
            }

(2)在该Controller的视图中创建异步表单：

@{
        ViewBag.Title = "Home Page";
    }
    
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
    @using (Ajax.BeginForm("BaseInfo", "Home", new AjaxOptions
    {
        UpdateTargetId = "msgDiv",
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "Post",
        OnFailure = "fail",
        OnSuccess = "success",
        LoadingElementId = "loadingmsg"
    }))
    {
        <input type="text" name="txtName"/>
        <input type="submit">
    }
    <div id="loadingmsg" style="display:none">
        </div>
    <div id="msgDiv"></div>
    <script type="text/javascript"> function fail(txt) { alert("查询失败： "); } function success(txt) { alert("查询成功" + txt); } </script>

运行结果：  
![strip][]

#### 5.3 MVC Areas ####

为什么会出现Areas（区域）？  
  随着业务的需要，结构需求越来越多，Views目录下面的文件夹越来越多，又或者需要更改结构的页面路径，另外可能是多个人合作开发，有多个Web项目需要合并在一个网站中访问。  
  MVC项目目录结构缺点：  
\* 不利分功能协作开发（购物车，商品管理，用户权限管理……）  
\* 代码结构臃肿

#### 5.3.1 Area 使用入门 ####

（1）在项目右击，添加Area，命名Admin  
![1240 10][]  
（2）修改AdminAreaRegistration.cs(有需要的情况下，例如修改区域名称或者路由)  
![1240 11][]  
（3）我们在新建MVC项目的时候会自动在Global中Application\_Start()里面的第一行进行区域路由注册：  
![1240 12][]  
（4）在Admin区域下面添加控制器Home  
（5）添加Index视图：

@{
        ViewBag.Title = "Index";
    }
    
    <h2>This is my Admin Areas index page.</h2>

（6）运行项目，输入地址：[http://localhost:3891/Admin/Home][http_localhost_3891_Admin_Home]  
（7）运行结果：  
![1240 13][]

#### 5.3.2 Area注册类放到单独的程序集 ####

（1）新建AdminArea类库  
（2）将原来MvcArea项目中的AdminAreaRegistration.cs文件复制到AdminArea类库项目中。  
（3）添加System.Web.Mvc和System.Web的程序集引用。  
![1240 14][]

（4）删除原来MvcArea项目中的AdminAreaRegistration.cs文件。  
（5）在MvcArea项目中添加对类库项目AdminArea的引用。  
（6）运行项目，输入[http://localhost:3891/Admin/Home][http_localhost_3891_Admin_Home]  
![1240 15][]

微信公众号：  
![1240 16][]

![1240 17][]

[1240]: /images/20210615/f678dbec5eec4d35a09cf3d6f9ea970a.png
[1240 1]: /images/20210615/04119b37a5f9461f8953fd40159e661a.png
[1240 2]: /images/20210615/754a6921651b43ea99813b7db383f4b3.png
[1240 3]: /images/20210615/ea495bc2383948f5bd1e1dc5e2ba8b93.png
[1240 4]: /images/20210615/2e9e9bd63b8944de92aef5e30add69a6.png
[1240 5]: /images/20210615/6b48b0ccc1e74b408e965c0cdbda6d10.png
[1240 6]: /images/20210615/9957d7c20eb644e993f136b320950615.png
[1240 7]: /images/20210615/7857ecce3cb942aa9037e26e1bbd8c6a.png
[1240 8]: /images/20210615/918de9d488d54ce6b409596cdf02646d.png
[1240 9]: /images/20210615/59014b60548543b395d96e3db9820f8a.png
[strip]: /images/20210615/9264a59d2135449c822b654ff29e8acf.png
[1240 10]: /images/20210615/d427171416e54a30a36d34df940e4ddb.png
[1240 11]: /images/20210615/3c18ecb1829d411ebafd2bfd501bac61.png
[1240 12]: /images/20210615/138a62f13fd943ffb4d80ece3dc27b96.png
[http_localhost_3891_Admin_Home]: http://localhost:3891/Admin/Home
[1240 13]: /images/20210615/2e5578784e0546768e528551340a005f.png
[1240 14]: /images/20210615/b100f5e4660241a482d32a967910090c.png
[1240 15]: /images/20210615/0edbe7e08db442b58cc443b5ed56400e.png
[1240 16]: /images/20210615/947999625f64429fa9b9e8c04f70a297.png
[1240 17]: /images/20210615/961747d47d5142fba70210d51b92137e.png