ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

学习MVC(模型视图控制器)在7天-第3天

2020-08-08 10:01:10  阅读:169  来源: 互联网

标签:控制器 Code 步骤 视图 MVC 创建


MVC 2是安静的老和本文是多年后写的。我们建议您从我们开始阅读新鲜学习MVC 5从这里一步一步系列:http: / / www.codeproject.com/Articles/866143/Learn-MVC-step-by-step-in-days-Day 介绍 所以,会议议程是什么? 在第三天的学习MVC一步一步我们将在下面做以下5个实验室。 让我们从上述三个实验室。 通知你:如果你是全新的MVC(模型-视图-控制器),请参见本文的最后一部分为启动或可以查看其他MVC文章如下所列:- 第一天:控制器、强类型的视图和助手类 http://www.codeproject.com/Articles/207797/Learn-MVC-Model-view-controller-Step-by-Step-in-7 第二天:单元测试、路由和出站url http://www.codeproject.com/Articles/259560/Learn-MVC-Model-view-controller-Step-by-Step-in-7 第三天:局部视图、数据注释,剃须刀,身份验证和授权 http://www.codeproject.com/Articles/375182/Learn-MVC-Model-View-Controller-Step-by-Step-in-4 第四天:- JSON, JQuery、状态管理和中控制器 http://www.codeproject.com/Articles/667841/Learn-MVC-Model-view-controller-Step-by-Step-in-3 第五天:捆绑、缩小视图模型、领域和异常处理 http://www.codeproject.com/Articles/724559/Learn-MVC-Model-view-controller-Step-by-Step-in-7 第六天:显示模式,MVC OAuth,模型绑定、布局和自定义视图引擎 http://www.codeproject.com/Articles/789278/Learn-MVC-Model-view-controller-Step-by-Step-in-d 实验室10:局部视图 当我们谈论web应用程序中,可重用性是关键。所以作为MVC开发人员我们要创建可重用的观点。例如我们想创建可重用视图页脚和页眉视图和使用它们在一个大的MVC视图。 可重用视图可以通过创造“部分视图”。 步骤1:创建一个简单的视图 第一步是创建一个简单的视图和一个控制器。你可以看到从下面的快照,我已经创建了一个简单的视图称为“索引。aspx Homecontroller.cs“将通过调用。 如果你直接来这部分,请参见前面的实验室同步。 步骤2:创建一个简单的局部视图 现在,我们已经创建了主要观点,是时候创建一个局部视图,可以消耗在“指数”的观点。为了创建一个局部视图,右键单击视图文件夹和马克复选框“创建一个局部视图”,如以下图所示。 第三步:放点东西在局部视图 把一些文本或逻辑部分视图。 隐藏,复制Code

<%@ControlLanguage="C#"Inherits="System.Web.Mvc.ViewUserControl<dynamic>"%>
This is reusable view

第四步:调用的主要的部分视图 最后调用局部视图的主要视图使用Html。RenderPartial方法”功能,通过功能的视图名称,如下面代码片段所示。 隐藏,复制Code

<body>
<div>
<% Html.RenderPartial("MyView"); %>
</div> 
</body> 

也确保局部视图是你的主要观点是在同一个文件夹中。如果它不是,那么你也需要通过RenderPartial方法函数的路径。你可以看到下面的图我已经局部视图的主要“视图”文件夹。 一件事是明显的,主要的图标视图和部分是非常不同的。你可以看到黄色的边界的局部视图图标中不存在主要视图图标。 第五步:运行程序,看行动 最后做一个CTRL + F5,把适当的控制器路径,并看到你的结果。下面是如何的快照。 实验室11:验证使用数据注释 验证数据是一个关键的事情在任何web应用程序。作为一名开发人员你想运行在客户端(浏览器)和验证在服务器端。所以你可能会喜欢写验证一次,然后期望验证框架生成两端验证逻辑。好消息,这是可能通过使用数据注释。在MVC模型值进行验证。所以一旦模型内的数据模型表示你想问题,提供适当的数据吗?值范围吗?等。 数据注释是元数据,您可以应用在模型和MVC框架将使用提供的元数据进行验证。 在这个实验室让我们执行验证通过使用数据注释。首先是使用实验室4和创建一个简单的模型和一个强类型数据输入视图。如果你来到这个实验室直,请看第一天实验室在继续之前。 假设您已经创建了模型和强类型的观点,让我们开始应用数据注释。 注意:应该是一个强类型的视图创建的视图。 步骤1:装修模型与数据注释 导入数据注释名称空间,下面的代码片段所示。 隐藏,复制Code

using System.ComponentModel.DataAnnotations;  

假设我们有一个客户模型,我们希望确保客户代码字段是强制性的。所以你可以应用属性“要求”所示的贝尔现在的代码片段。如果验证失败,你想显示一些错误消息,您可以通过“ErrorMessage”也。 隐藏,复制Code

public class Customer
{
    [Required(ErrorMessage="Customer code is required")]
    public string CustomerCode
    {
        set;
        get;
    }
}

步骤2:改变ASPX代码 现在有一些代码更改我们会在ASPX代码体内比我们之前的实验室。我们想要显示的错误消息,如果数据是不合适的。这是通过使用下面的代码片段。 隐藏,复制Code

<%= Html.ValidationSummary() %> 

我们还需要代码的HTML表单来输入数据。下面的代码片段是一样的。请注意,“EditorForModel”功能将自动生成UI控件查看模型属性。所以我们不需要创建控制单独作为我们实验室4。 隐藏,复制Code

<% using (Html.BeginForm("PostCustomer", "Home", FormMethod.Post))
{ %>
<%= Html.EditorForModel() %>
<inputtype="submit"value="Submit customer data"/>
<%}%>

步骤3:启用客户端验证 正如前面说的我们想火验证服务器和客户端上。为了火验证在客户端,我们需要参考三个JavaScript文件,如下面代码片段所示。 隐藏,复制Code

<headrunat="server">
<scriptsrc="<%= Url.Content("~/Scripts/MicrosoftAjax.debug.js") %>"type="text/javascript"></script>
<scriptsrc="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js") %>"type="text/javascript"></script>
<scriptsrc="<%= Url.Content("~/Scripts/MicrosoftMvcValidation.debug.js") %>"type="text/javascript"></script>
<% Html.EnableClientValidation(); %>
</head>

还要注意调用EnableClientValidation方法由于它启用客户端验证。 隐藏,复制Code

<% Html.EnableClientValidation(); %> 

第四步:编写控制器逻辑 从UI,当表单调用控制器的一个帖子,你想知道模型状态是否正确。这可以通过检查状态。IsValid财产。如果这个属性是有效的然后调用Save方法调用谢谢看来,其他回到客户视图。 隐藏,复制Code

[HttpPost]
public ActionResult PostCustomer(Customer obj)
{
if (ModelState.IsValid)
{
    obj.Save();
    return View("Thanks");
}
else
{
    return View("Customer");
}
}

第五步:运行应用程序的行动 最后运行您的应用程序,看看数据注释。 总结其他数据注释属性 还有其他数据注释属性使得复杂的验证。以下是其中一些列表: 如果你想检查字符串长度,您可以使用StringLength。 隐藏,复制Code

[StringLength(160)]
public string FirstName { get; set; }

如果你想使用一个正则表达式,可以使用RegularExpression属性。 隐藏,复制Code

[RegularExpression(@"[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}")]
public string Email { get; set; } 

如果你想检查数字是否在范围内,您可以使用范围属性。 隐藏,复制Code

[Range(10,25)]
public int Age { get; set; }

有时你想要比较一个字段的值与另一个领域,我们可以使用比较属性。 隐藏,复制Code

public string Password { get; set; }
[Compare("Password")]
public string ConfirmPass { get; set; }

如果你想要一个特定的错误消息,您可以使用错误。 隐藏,复制Code

var ErrMessage = ModelState["Email"].Errors[0].ErrorMessage; 

如果你已经创建了模型对象可以显式调用TryUpdateModel控制器检查对象是否有效。 隐藏,复制Code

TryUpdateModel(NewCustomer);

如果你想要在控制器中添加错误可以使用“AddModelError”功能。 隐藏,复制Code

ModelState.AddModelError("FirstName", "This is my server-side error.");

实验室12:MVC 3:剃须刀 直到现在这篇文章是使用MVC 2但是是时候我们也开始讨论和做实验室新发布版本的MVC框架。改变是人类生活的一部分,同样是对MVC j .所以在这一节中我们讨论MVC 3后是下一个发布版本的MVC 2。 供参考:最新版本MVC4和在以后的日子我将联系甚至那些版本。所以要有耐心。 如果你没有安装这个,然后单击并得到MVC 3模板。 如果你觉得无论我们学到了在MVC 2是一种浪费,不,不是。相反MVC 3是向后兼容MVC 2。所以不管你学到了在MVC 2仍然适用于MVC 3。 现在不是讨论所有的新功能让我们关注的最大特征MVC3我个人认为这是一个重大转折,剃须刀。 剃须刀是什么?简单明了的回答,这是一个MVC的视图类型。在MVC 2默认视图是ASP。网络页面,即。, Web表单视图。现在,web表单的问题的观点是没有思维的MVC,所以语法有点重。 开发商要求清洁,轻量级的视图和语法较低噪音:答案是剃须刀。 让我们创建一个简单的实验室演示使用剃须刀视图。 步骤1:安装使用相同的MVC 3和创建一个项目 安装MVC 3模板和创建一个项目选择MVC 3下面的模板。 步骤2:选择剃须刀 在下一个屏幕上弹出什么您想要创建的应用程序。 现在让我们让生活简单,让我们选择空选项。我们需要选择的第二件事就是把我们想要的,所以我们选择剃刀和前进。 一旦创建了项目,您可以看到剃须刀文件与名称“.cshtml”。现在“_ViewStart”页面只不过是常见的页面将使用视图为常见的布局和通用代码。 步骤3:添加一个视图和调用相同的控制器 现在继续,添加一个新的视图和调用这个视图控制器。添加和调用视图与控制器仍在前面讨论的一样实验室。记住选择视图作为Razor视图。 隐藏,复制Code

public class StartController : Controller
{
    //
    // GET: /Start/
    public ActionResult Index()
    {
        return View("MyView");
    }
}

步骤4:公关actice剃刀语法 现在我们已经准备好了基本的项目和视图,让我们来运行一些常见的Razor语法,并尝试感受一下Razor与ASPX视图相比有多简单。 练习1:单行代码 如果您只想显示一个简单的变量,您可以执行如下所示的操作。所有Razor语法都以@开头。如果你只有一行代码,你不需要“{”。Razor很有逻辑地计算出了结局。 隐藏,复制Code

Todays date  @DateTime.Now  

如果将上述语法与ASPX视图进行比较,则需要键入以下代码。那么,它的语法不是更简单、简洁和轻量级吗? 隐藏,复制Code

<%=DateTime.Now%> 

实践2:多行代码 如果有多行代码,可以使用“@”后面跟着“{”,如下面的代码片段所示。 隐藏,复制Code

@{
    List<string> obj = new List<string>();
    obj.Add("Mumbai");
    obj.Add("Pune");
    obj.Add("Banglore");
    obj.Add("Lucknow");
}

实践3:Foreach循环和IF条件 循环和if条件变得更简单,如下面的代码行所示。 隐藏,复制Code

@foreach (string o in obj)
{
   @o <br/>
}
@if (DateTime.Now.Year.Equals(2011))
{
  // Some code here        
}  

练习4:不要担心@ 如果你认为Razor把Razor的@和你的邮箱地址@搞混了,不用担心,Razor能理解其中的区别。例如,在下面的一行中,Razor的第一行将作为代码执行,它理解的第二行代码只是一个电子邮件地址。 隐藏,复制Code

@DateTime.Now
questpond@yahoo.com

练习5:显示@ 如果您想显示“@”,只需键入两遍,如下面的代码片段所示。显示的内容如下图所示。 隐藏,复制Code

Tweet me @@Shivkoirala

实践6:使用Razor显示HTML 如果您想在浏览器上显示HTML。例如,下面是一个叫做link的简单变量,它有HTML代码。我在浏览器上显示变量数据。 隐藏,复制Code

@{
    var link = "<ahref='http://www.questpond.com'>Click here</a>";
}
@link;

如果执行上面的代码,您会惊奇地发现它并没有显示为HTML,而是如下所示的简单显示。这不是我们所期望的。我们期待一个适当的HTML显示。这是由Razor完成的,以避免XSS攻击(我将在后面的章节中讨论)。 不过不用担心,剃须刀团队已经处理好了。您可以使用“Html”。以显示与下面代码片段相同的内容。 隐藏,复制Code

@{
    var link = "<ahref='http://www.questpond.com'>Click here</a>";
}
@Html.Raw(link); 

实验13:MVC安全(Windows认证) 在任何应用程序中,安全性都是最重要的事情之一,无论您使用何种技术开发它们,MVC也是如此。 在我们开始这个实验之前,有一件事我们需要明白,MVC最终是站在ASP上的。净引擎。换句话说,MVC使用相同的安全方法,适用于ASP。NET也就是Windows和表单身份验证。 注意:-在这篇文章中,我们不会研究Windows和表单身份验证的基本原理。如果你是新的ASP。您可以阅读本文链接http://www.codeproject.com/Articles/98950/ASP-NET-authentication-and-authorization 让我们尝试在MVC 3应用程序中实现windows身份验证。 现在,实现Windows身份验证的一种方法是使用内部网应用程序选项创建项目。如前所述,启用内部网应用程序选项对来自Windows Active Directory的用户进行身份验证。 现在我们不使用那个选项,让我们使用empty application选项并从头开始创建,这样我们可以更好地理解。 步骤1:启用Windows身份验证 你已经创建了一个项目,第一步是启用Windows认证使用授权。标签所示。是的,这段代码与我们为ASP.NET所做的代码相同。 隐藏,复制Code

<authenticationmode="Windows"/>
<authorization>
<denyusers="?"/>
</authorization>

步骤2:只是一些缺陷 在MVC 3模板中,有一个小缺陷。默认情况下,它运行表单身份验证。在appsettings标记中设置以下标记以避免出现问题。我花了两个小时才弄明白,真是浪费! 隐藏,复制Code

<addkey="autoFormsAuthentication"value="false"/>
<addkey="enableSimpleMembership"value="false"/>
<appSettings>
<addkey="webpages:Version"value="1.0.0.0"/>
<addkey="ClientValidationEnabled"value="true"/>
<addkey="UnobtrusiveJavaScriptEnabled"value="true"/>
<addkey="autoFormsAuthentication"value="false"/>
<addkey="enableSimpleMembership"value="false"/>
</appSettings>

步骤3:在控制器/操作上应用授权标签 一旦启用了Windows身份验证,请使用“[Authorize]”标签并指定哪些用户可以访问控制器和操作。如果愿意,还可以指定角色。 隐藏,复制Code

[Authorize(Users= @"WIN-3LI600MWLQN\Administrator")]
public class StartController : Controller
{
    //
    // GET: /Start/
    [Authorize(Users = @"WIN-3LI600MWLQN\Administrator")]
    publicActionResult Index()
    {
        return View("MyView");
    }
}

请注意,用户应该出现在您的Windows广告或本地用户组。就像在我的例子中一样,管理员出现在我的本地Windows用户组中。 步骤4:创建设置 现在是时候在IIS上发布这个解决方案了,这样我们就可以测试Windows身份验证是否有效。为了做到这一点,我们需要将必要的MVC dll也发布到服务器上。因此,右键单击项目并选择“添加可部署的依赖项”。 在下一个屏幕中,它将提示您希望包括哪些依赖项。现在我有Razor视图,所以我选择了两个选项。 一旦您可以看到依赖的dll被添加到项目中。 步骤5:创建IIS应用程序 下一步是创建仅启用Windows身份验证的IIS应用程序,如下图所示。 第六步:发布 一次您已经创建了IIS应用程序,现在应该将应用程序发布到web应用程序文件夹。因此,单击Build和Publish,如下图所示。我用“File system”作为发布方法,你可以自己选择。 第7步:运行控制器和操作 最后运行控制器和操作,查看如何弹出Windows authentication框输入用户ID和密码。 如果适当地输入了凭证,您应该能够看到该视图。 实验室14:- MVC安全(表单认证) 在之前的实验室中,我们看到了如何进行windows身份验证。Windows认证非常适合内部网网站。但当我们谈到互联网网站,创建和验证用户从Windows广告/工作组是不可行的选择。所以在这种情况下,“表单身份验证”是最好的选择。 第1步:-定义登录页面控制器 我们需要做的第一件事是定义将调用登录视图的控制器。因此,我创建了一个简单的索引操作,它调用一个称为index的视图。这个索引视图将接受用户名和密码之类的输入。 , 隐藏,复制Code

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

步骤2:-创建索引视图 下一步是创建包含用户名和密码的登录表单。为了创建表单,我使用了razor view和HTML helper类。如果你是新的HTML帮助类,请参阅第一天的实验室。 这个HTML表单正在使用HTTP post方法对当前在“Home”控制器中的动作“Login”进行post。所以当用户按下submit时,它会点击“Login”操作。接下来要做的是创建“Login”操作,它将验证用户名和密码。 隐藏,复制Code

@{Html.BeginForm("Login", "Home", FormMethod.Post);}        User Name :- @Html.TextBox("txtUserName") <br/>        Password :- @Html.TextBox("txtPassword") <br/>          <inputtype="submit"value="Login"/> <br/>        @{ Html.EndForm(); }

步骤3:-验证凭证 在登录操作中,我们需要做的第一件事是检查用户是否正确。现在,我已经硬编码了用户名和密码的验证。这总是可以通过从SQL Server或其他来源查询来替代。 隐藏,复制Code

if ((Request.Form["txtUserName"] == "Shiv") && (Request.Form["txtPassword"] == "Shiv@123")){…..} 

一旦我们检查了凭证,下一步就是使用著名的“FormsAuthentication”类并设置cookie,表明这个用户是正确的。 这样在用户到来的下一个请求中,他就不会被一次又一次地验证。在cookie被设置重定向到“关于”视图或其他只是站在“索引”视图。 隐藏,复制Code

public ActionResult Login(){if ((Request.Form["txtUserName"] == "Shiv") && (Request.Form["txtPassword"] == "Shiv@123")){            FormsAuthentication.SetAuthCookie("Shiv",true);            return View("About");}else{            return View("Index");} 

My about view只是一个简单的页面,如下所示。 隐藏,复制Code

@{    Layout = null;}<!DOCTYPEhtml><html><head>    <title>About</title></head><body>    <div>        This is About us    </div></body></html> 

步骤4:- Authorize属性 我们还需要在控制器上使用put " [Authorize] "属性,我们希望对未授权的用户进行限制。例如,您可以在下面的代码片段中看到,“Default”和“About”操作使用“[Authorize]”属性进行修饰。 因此,如果任何未经授权的用户,直接点击这些控制器中的任何一个,他们将被送回“索引”视图,即回到登录屏幕。 隐藏,复制Code

[Authorize]public ActionResult Default(){ return View();}[Authorize]public ActionResult About(){return View();} 

第五步:改变“网络”。配置”文件 最后,我们需要在“网络”领域做出著名的改变。配置”,即启用“表单”安全性。下面代码片段中需要注意的最重要部分是“LoginUrl”属性。 通常在ASP。这个登录URL指向一个asp.net。NET页面,但在MVC中它指向一个动作,即“/Home/Index”。此操作调用登录凭据页面。 隐藏,复制Code

<authenticationmode="Forms">      <formsloginUrl="~/Home/Index"timeout="2880"/>    </authentication>

步骤6:-参见表单认证的操作 有了以上5个步骤,你现在完全可以开始了。如果您现在尝试直接调用“About”操作,它将在下面的屏幕中显示。此测试证明“表单”身份验证工作正常。它自动检测到用户是无效的,并将其重定向到“Index”操作,该操作进一步调用“Login”表单。 第四天是什么? 在第四天,我们将研究Jquery, Json,异步控制器和Viewdata, Tempdata, Viewbag和会话变量之间的差异。你可以在下面链接阅读第四天。点击这里查看第四个MVC的步骤。 最后注意:你可以观看我关于各种主题的c#和MVC培训视频,比如WCF、SilverLight、LINQ、WPF、设计模式、实体框架等等。不要错过我的。net和c#面试问答手册。 用于与各种主题相关的技术培训,包括ASP。请联系SukeshMarla@gmail.com或访问www.sukesh-marla.com 从MVC 5开始 如果你想开始与MVC 5开始与下面的视频学习MVC 5在2天。 50个MVC访谈问题和答案 如果你要去面试,你可以阅读我的50个重要的MVC面试问题回答文章http://www.codeproject.com/articles/556995/model-view-controller-mvc-interview-question- and 你对MVC是全新的吗? 如果你是一个新手,我建议你从下面的四个视频开始(大约10分钟),这样你就可以快速学习MVC。 实验1:一个简单的Hello World ASP。净MVC品信息 实验室2:在这个实验中我们将看到如何共享数据控制器和视图使用视图之间的数据 实验室3:客户在这个实验中,我们将创建一个简单的模型,发展一些数据,并显示在一个视图 实验室4:在这个实验中,我们将创建一个简单的客户和一些验证数据输入屏幕视图 所以,会议议程是什么?第一天:控制器、强类型的视图和助手类2天:单元测试,路由和出站url第三天:-局部视图、数据注释,剃须刀,身份验证和授权第四天:- JSON, JQuery,状态管理和中控制器第五天:捆绑,缩小,视图模型、领域和异常处理6天:显示模式,MVC OAuth,模型绑定、布局和自定义视图引擎实验室10:局部视图 步骤1:第二步:创建一个简单的视图创建一个简单的局部视图第三步:放一些局部视图中的第四步:调用局部视图在主第五步:运行程序,看行动 实验室11:验证使用数据注释 步骤1:装修模型与数据注释步骤2:改变ASPX代码步骤3:启用客户端验证步骤4:编写控制器逻辑步骤5:运行应用程序的行动总结其他数据注释属性 实验室12:MVC 3:剃须刀 步骤1:安装MVC 3和创建一个项目使用相同的步骤2:选择剃须刀步骤3:添加一个视图和从控制器调用相同的步骤4:剃须刀语法练习 练习1:单行代码实践2:多行代码的练习3:Foreach循环,如果条件练习4:不要担心@练习5:显示@练习6:HTML显示剃刀实验室13:MVC安全(Windows身份验证) 步骤1:启用Windows身份验证步骤2:只是一些缺陷步骤3:申请授权标签在你的控制器/动作步骤4:创建设置步骤5:创建IIS应用程序步骤6:发布第七步:运行的控制器和动作 实验室14:——MVC安全(表单身份验证) 步骤1:定义登录页面控制器步骤2:——创建索引视图步骤3:——验证凭证步骤4:-第五步:授权属性变化”网络。配置文件第六步:看到表单验证 第四天是什么?50 MVC的面试问题的答案你全新的MVC吗? 局部视图。验证使用数据注释。剃须刀(MVC 3)。MVC Windows身份验证MVC表单验证 空选项创建一个项目用最少的文件。互联网应用程序选项创建一个shell应用程序包括用户注册和认证,导航和一致的视觉风格。内部网应用程序选项是非常一样的互联网应用,唯一的区别是身份验证发生在Active Directory域/基础设施。 本文转载于:http://www.diyabc.com/frontweb/news1869.html

标签:控制器,Code,步骤,视图,MVC,创建
来源: https://www.cnblogs.com/Dincat/p/13456538.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有