循序渐进学习 MVC（模型-视图-控制器）7 天 - 第 4 天

Shivprasad koirala

4.94/5 (122投票s)

2013年10月12日

CPOL

11分钟阅读

333981

第 4 天，我们将介绍 JSON、Jquery、异步控制器和会话管理。

MVC 2 已经相当过时了，这篇文章是很多年前写的。我们建议您从我们最新的循序渐进学习 MVC 5 系列开始阅读：-https://codeproject.org.cn/Articles/866143/Learn-MVC-step-by-step-in-days-Day

那么，今天的议程是什么？
第1天：-控制器、强类型视图和辅助类
第2天：-单元测试、路由和传出URL
第3天：-部分视图、数据注释、Razor、身份验证和授权
第4天：- JSON、JQuery、状态管理和异步控制器
第5天：-打包、最小化、视图模型、区域和异常处理
第6天：-显示模式、MVC OAuth、模型绑定器、布局和自定义视图引擎
实验 15：JSON、MVC 和 Jquery
实验 16：MVC 中的会话管理（ViewData、ViewBag、TempData 和会话变量）
实验 17：异步控制器
第五天讲什么？
50个MVC面试题及答案
您是MVC新手吗？

那么，今天的议程是什么？

第 4 天，我们将介绍 MVC 中的 JSON、Jquery、异步控制器和会话管理。

您可以从下方获取 ASP.NET MVC 教程其他部分的链接：-

第1天：-控制器、强类型视图和辅助类

https://codeproject.org.cn/Articles/207797/Learn-MVC-Model-view-controller-Step-by-Step-in-7

第2天：-单元测试、路由和传出URL

https://codeproject.org.cn/Articles/259560/Learn-MVC-Model-view-controller-Step-by-Step-in-7

第3天：-部分视图、数据注释、Razor、身份验证和授权

https://codeproject.org.cn/Articles/375182/Learn-MVC-Model-View-Controller-Step-by-Step-in-4

第4天：- JSON、JQuery、状态管理和异步控制器

https://codeproject.org.cn/Articles/667841/Learn-MVC-Model-view-controller-Step-by-Step-in-3

第5天：-打包、最小化、视图模型、区域和异常处理

https://codeproject.org.cn/Articles/724559/Learn-MVC-Model-view-controller-Step-by-Step-in-7

第6天：-显示模式、MVC OAuth、模型绑定器、布局和自定义视图引擎

https://codeproject.org.cn/Articles/789278/Learn-MVC-Model-view-controller-Step-by-Step-in-d

实验 15：JSON、MVC 和 Jquery

如果您不熟悉 JSON，请在继续进行此实验之前阅读本文，JSON 是什么？

所以在这个实验中，我们将从 MVC 中以 JSON 格式公开一个简单的“Customer”对象，并使用 Jquery 来使用它。

对于这个实验，请确保项目是使用基本项目模板创建的，以便 MVC 项目中包含必要的 Jquery 库。

步骤 1：创建一个简单的 Customer 模型

因此，第一步是在 MVC 项目中创建一个简单的“Customer”类。

public class Customer
    {
        private string _CustomerCode;
        public string CustomerCode
        {
            get { return _CustomerCode; }
            set { _CustomerCode = value; }
        }
    }

步骤 2：将 Customer 对象公开为 JSON

要以 JSON 格式公开 Customer 对象，我们需要使用“JsonResult”，如下面的代码片段所示。

public JsonResult getJson()
{
            Customer obj = new Customer();
            obj.CustomerCode = "c001";
            return Json(obj,JsonRequestBehavior.AllowGet);
}

请务必运行带有上述 JSON 操作的控制器，以检查 JSON 结果是否显示正确。如果您使用 Chrome，它会显示在浏览器中；如果使用 Internet Explorer，它会吐出一个文件。

步骤 3：在 Jquery 中使用 JSON 控制器

如果您不熟悉 Jquery，请阅读本文 Jquery 是什么？

下一步是使用 MVC 视图在 Jquery 中使用 JSON 数据。所以继续添加一个视图，例如我的视图名称是“LearnJquery.aspx”。

首先，在 ASPX 页面的顶部添加 Jquery 库。如果您在项目中找不到 jquery 库，则意味着您没有使用基本模板创建 MVC 项目。

<script src="../../Scripts/jquery-1.8.2.js"></script>

然后，您可以使用“getJson”方法调用公开 JSON 格式的控制器，如下所示。它需要三个参数：-

 $.getJSON("/Json/getJson", null, Display);
function Display(data)
{
alert(data.CustomerCode);
}

完整的 MVC 视图 HTML 如下所示。我创建了一个简单的 HTML 按钮，在点击事件中，我调用了一个“getJson”javascript 方法，该方法调用 JSON 控制器并使用 javascript 警报显示 JSON 数据。

<script language="javascript">
        function getJson() {
            $.getJSON("/Json/getJson", null, Display);
            return true;
        }
        function Display(data)
        {
            alert(data.CustomerCode);
        }
</script>
<input type="button" value="See Json data" onclick="return getJson();"/>

我通过使用“DisplayJson”操作调用了这个视图。

public class JsonController : Controller
{
        public ActionResult DisplayJson()
        {
            return View("LearnJquery");
        }
}

步骤 4：运行应用程序并查看数据

完成所有工作后，就可以点击“DisplayJson”操作来欣赏其运行效果了。

实验 16：MVC 中的会话管理（ViewData、ViewBag、TempData 和会话变量）

MVC 的主要目标是创建 Web 应用程序，而 Web 应用程序使用 HTTP 协议。现在 HTTP 协议本质上是无状态的。因此，当您向 MVC 应用程序发送请求时，它会处理该请求并忘记该请求。下次同一用户发送请求时，MVC 会将其视为一个全新的请求。

现在考虑以下情况：-

简而言之，我们需要某种机制来帮助我们在 MVC 的请求和响应之间保持状态。

在 MVC 中保持状态有 3 种方法，具体取决于您从哪个层导航到哪个层。

Temp data：-有助于在单个请求和响应的重定向之间维护数据。重定向可以是从控制器到控制器，也可以是从控制器到视图。

View data：-有助于在从控制器到视图移动时维护数据。

View Bag：-它是 ViewData 的动态包装器。使用“Viewbag”时无需类型转换。它在内部使用 dynamic 关键字。

Session variables：-通过使用会话变量，我们可以一直维护数据直到浏览器关闭。

让我们通过演示来展示上述基本概念。

步骤 1：创建两个控制器“DefaultController1”和“DefaultController2”。

添加两个控制器“DefaultController1”和“DefaultController2”。

步骤 2：设置 Session、tempdata、viewdata 和 viewbag

在“Default1Controller”的“Action1”中，我们设置 session、tempdata、viewdata 和 viewbag 值，如下面的代码片段所示。设置完值后，我们重定向到属于“Controller2”的“SomeOtherAction”操作。

public class Default1Controller : Controller
    {
        //
        // GET: /Default1/
        public ActionResult Action1()
        {
            Session["Session1"] = "UntilBrowserCloses";
            TempData["FortheFullRequest"] = "FortheFullRequest";
            ViewData["Myval"] = "ControllertoView";
            ViewBag.MyVal = "ControllertoView";
            return RedirectToAction("SomeOtherAction","Default2");
        }    }

步骤 3：读取 Session、tempdata、viewdata 和 viewbag 值

在“Default2Controller”中，我们将尝试读取在“Default1Controller”中设置的值。读取值后，我们调用一个名为“SomeView”的视图。

请注意，我在重定向到视图之前设置了“ViewData”和“ViewBag”。

public class Default2Controller : Controller
    {
        //
        // GET: /Default2/
        public ActionResult SomeOtherAction()
        {
           string str = Convert.ToString(TempData["FortheFullRequest"]);
           string str2 =  Session["Session1"].ToString();
           string str3 = Convert.ToString(ViewData["Myval"]);
           ViewData["Myval"] = "ControllertoView";
ViewBag.MyVal = "ControllertoViewCollection";
            return View("SomeView");
        }
    }

“SomeView”视图仅显示“TempData”、“ViewData”、“ViewBag”和“Session”中的数据。

<%= TempData["FortheFullRequest"] %><br />
<%= ViewData["Myval"] %><br />
<%=  Session["Session1"] %>
<%=  ViewBag.MyVal %>
<a href="/Default1/Action1">Click</a>

因此，让我们在两个控制器操作中设置调试点，然后访问 Default1 控制器和 Action1 操作 https://:1203/Default1/Action1。在此操作中，session、tempdata、viewdata 和 viewbag 已加载。以下是监视窗口中的数据外观。

从这里，我们重定向到 controller2 操作“SomeOtherAction”。

在 controller2 中，您可以看到“TempData”和“Session”变量，但看不到“ViewBag”和“ViewData”（请参阅“str3”和“str4”设置为 null）。换句话说，“ViewData”和“ViewBag”在重定向时不会持久化数据，而“TempData”和“Session”变量会。

在调用视图“SomeView”之前，我又一次设置了“ViewData”和“ViewBag”。

调用视图时，我们可以看到所有数据。换句话说，“ViewData”和“ViewBag”会从控制器持久化到视图。Tempdata 和 session 也持久化了数据。

现在，当视图被调用时，我放置了一个点击超链接，该链接调用“Controller1”中的“Action1”。这是为了模拟一个全新的请求。

当我们点击链接时。所有其他变量都消失了，只有 session 变量会持久化，请看下图。这意味着“Session”变量可以在请求之间持久化。

下面是一个汇总表，显示了不同的持久化机制。

在...之间维护数据	ViewData/ViewBag	TempData（单个请求）	Session
从控制器到控制器	否	是	是
从控制器到视图	是	是	是
从视图到控制器	否	否	是

实验 17：异步控制器

MVC 应用程序最终都是托管在 IIS 中的 Web 应用程序。现在，当任何请求到达 MVC 控制器时，它会从线程池中提取一个线程来处理该请求。换句话说，IIS Web 服务器维护一个线程池，而不是一次又一次地从头开始创建线程来获得性能优势。
假设一个 Web 服务器的线程池大小为 2。这只是一个假设，因为池大小为 2 是非常假设性的。但为了简化问题，请考虑线程池大小为 2。

那么，假设第一个请求到达站点，IIS 从线程池中提取一个现成的线程对象并开始处理该请求。与此同时，假设第二个请求也来了，IIS 再次从线程池中提取一个线程并开始处理第二个请求。

当第三个请求进来时，有趣的就开始了。IIS Web 服务器在池中没有更多的线程对象了，因为它们已经在处理“request1”和“request2”。所以它只是将第三个请求置于等待模式，或者服务器可以向客户端发送“503 Busy”消息。

这种情况被称为“线程饥饿”。通过使请求“异步”来克服线程饥饿的情况。这样，请求进来后，立即以“异步”方式处理，并立即释放服务该请求的线程。

因此，为了避免这种情况，我们可以通过使我们的控制器“异步”来实现。

下面是一个很好的视频，演示了 MVC 线程饥饿。

因此，让我们一步一步地了解如何实现 MVC 异步控制器。

步骤 1：继承自 AsyncController 类

考虑下面的控制器类“HeavyController”，它有一个操作“SomeHeavyMethod”，该操作等待 20 秒。因此，让我们了解如何将这个简单的控制器变成一个异步控制器。

public class HeavyController : Controller
{
        //
        // GET: /Heavy/
        public ActionResult SomeHeavyMethod()
        {
            Thread.Sleep(20000);
            return View();
        }
}

因此，第一步是继承自“AsyncController”类。

public class HeavyController : AsyncController
{
}

步骤 2：在方法名后附加 Async

下一步是在方法名后附加“Async”单词。所以您可以看到“SomeHeavyMethod”已更改为“SomeHeavyMethodAsync”。

繁重的逻辑代码，即“Thread.Sleep”，被移到一个单独的方法中，并且该方法使用任务并行库从“SomeHeavyMethodAsync”调用。

每次启动一个“Task”或“Thread”时，我们都会使用“AsynchManager”递增未完成的操作计数器，每当一个多线程任务完成时，我们都会递减计数器。

 public class HeavyController : AsyncController
{
public void SomeHeavyMethodAsync()
{
AsyncManager.OutstandingOperations.Increment();
Task.Run(new Action(Heavy));
}
public void Heavy()
{
Thread.Sleep(20000);
AsyncManager.OutstandingOperations.Decrement();
}
}

步骤 3：创建 completed 方法

现在，一旦所有多线程任务都完成并且未完成的操作为零，我们就需要返回视图。因此，对于同一件事，我们需要创建一个在方法名后附加“Completed”单词的操作结果方法。当所有未完成的操作为零时，就会调用此方法。

public ActionResult SomeHeavyMethodCompleted()
{
       return View();
}

步骤 4：确保创建“SomeHeavyMethod.aspx”视图

还要确保您添加带有文本的“SomeHeavyMethod”视图。

<html>
<head runat="server">
<meta name="viewport" content="width=device-width" />
<title>Some heavy method</title>
</head>
<body>
<div>
        This is loaded after some time....
</div>
</body>
</html>

步骤 5：运行并享受

现在尝试访问“Heavy/SomeHeavyMethod”并查看输出。我建议您测量“Thread queued”来查看异步控制器的优势。观看此视频了解如何测量“Thread Queued” http://www.youtube.com/watch?v=wvg13n5V0V0。

第五天讲什么？

仍在处理中。

最后说明，您可以在我的 c# 和 MVC 培训视频中观看各种部分，如 WCF、Silverlight、LINQ、WPF、设计模式、Entity Framework 等。无论如何，请不要错过我的 .NET 和 c# 面试题和答案一书，来自 www.questpond.com。

有关ASP.NET、设计模式、WCF、MVC、BI、WPF等各种主题的技术培训，请联系SukeshMarla@gmail.com或访问www.sukesh-marla.com

从 MVC 5 开始

如果您想从 MVC 5 开始，请从下面的视频“2 天学会 MVC 5”开始。

50个MVC面试题及答案

如果您要去面试，您可以阅读我关于 50 个重要 MVC 面试题及解答的文章 https://codeproject.org.cn/Articles/556995/Model-view-controller-MVC-Interview-questions-and

您是MVC新手吗？

如果您是完全的新手，我建议从以下 4 个大约 10 分钟的视频开始，这样您可以快速进入 MVC。

实验 1：一个简单的 Hello world ASP.NET MVC 应用程序。

实验 2：在此实验中，我们将了解如何使用 ViewData 在控制器和视图之间共享数据。

实验 3：在此实验中，我们将创建一个简单的客户模型，为其添加一些数据，并在视图中显示。

实验 4：在此实验中，我们将创建一个简单的客户数据录入屏幕，并在视图上进行一些验证。

“getJson”的第一个参数是带有完整控制器/操作路径格式的 MVC JSON URL。
第二个参数是要传递的数据。现在它是 NULL，因为我们更感兴趣的是获取 JSON 数据而不是发送数据。
最后一个参数是回调方法（“Display”），一旦我们从控制器获取 JSON 数据，就会调用它。“Display”函数也包含在下面的代码片段中。我只是用属性名显示一个警报。供参考，您可以看到我如何输入“data.CustomerCode”，无需解析，JSON 数据会自动转换为 javascript 对象。
最终用户向 MVC 站点发送请求。
MVC 发送登录页面。
用户输入正确详细信息并向 MVC 应用程序发送数据。
MVC 验证用户并发送网站的首页。MVC 应用程序现在忘记了用户的任何信息，因为它没有状态。
现在用户点击首页上的一个链接。该请求被发送到 MVC 应用程序，因为 MVC 应用程序已经忘记了用户的任何信息，它再次发送登录页面进行身份验证……用户会感到很奇怪……

循序渐进学习 MVC（模型-视图-控制器）7 天 - 第 4 天

目录

从 MVC 5 开始