基于.NET平台的分层架构实战（十一）——表示层的实现

最新推荐文章于 2020-07-12 11:57:41 发布

wnety

最新推荐文章于 2020-07-12 11:57:41 发布

阅读量1.4k

点赞数

分类专栏： .NET 文章标签：平台 .net session stylesheet mvc server

.NET 专栏收录该内容

76 篇文章 2 订阅

订阅专栏

　　在这篇文章中，将讨论一下表示层的实现方法。

　　表示层是一个系统的“门脸”，不论你的系统设计的多么优秀，代码多么漂亮，系统的可扩展性多么高，但是最终用户接触到的大多是表示层的东西。所以，表示层的优劣对于用户最终对系统的评价至关重要。一般来说，表示层的优劣有一下两个评价指标：

　　1.美观。即外观设计漂亮，能给人美的感觉。

　　2.易用。即具有良好的用户体验，用户用起来舒服、顺手。

　　表示层的设计牵扯到很多非技术性问题，如美工、用户心理学等问题，但是在这篇文章中，将不过多涉及这些问题，一来是我的水平有限，二来是这些内容和本系列文章的关系不是很密切。这里将主要从技术实现的角度讨论表示层的设计。

　　一般来说，表示层的职责有以下两点：

　　1.接受用户的输入。

　　2.向用户呈现信息。

　　总体来说，就是与用户的交互。

　　而表示层的实现技术也是多种多样的，如C/S架构下一般使用Windows窗体技术（甚至是命令行窗体），而B/S架构下主要是使用Web页的形式实现。而且在Ajax技术出现以后，又分出了同步模型的B/S架构实现和异步模型的B/S架构实现。在这篇文章中，将主要讨论同步模型下B/S架构的表示层实现，而基于Ajax技术的异步模型将在下一篇中讨论。

　　另外，提到表示层的实现，大家一定会想到MVC这个词，不错MVC已经成为表示层设计的经典模式。J2EE平台上的Struts和最近微软推出的ASP.NET MVC都是实现MVC模式的框架。但是为了突出本系列文章的的重点——分层，而且也为了照顾初学者。这里将不设计MVC模式，而是用传统的ASP.NET编程模型来完成表示层的设计。

　　一下的所有讨论，将围绕“管理员登录”这个用例展开。下面我们来逐步实现管理员登录的表示层设计。

　　1.设计界面

　　为实现这个功能，我们首先要有一个Web页面。设计好的页面如下图所示：（时间所迫，制作过于简陋，各位见谅）

　　首先，我们要在“Web”工程下建立一个新的aspx文件，叫做Login.aspx，这就是管理员登录的Web页面。完成后这个文件的代码如下：

1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Login.aspx.cs" Inherits="Login" %> 2 3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5<html xmlns="http://www.w3.org/1999/xhtml" > 6<head runat="server"> 7　　<title>NGuestBook-管理员登录</title> 8　　<link href="Styles/Common.css" rel="stylesheet" type="text/css" /> 9　　<link href="Styles/Login.aspx.css" rel="stylesheet" type="text/css" /> 10</head> 11<body> 12　　<form id="form1" runat="server"> 13　　<div id="container"> 14　　　　<div id="box"> 15　　　　　　<h1>NGuestBook管理员登录</h1> 16　　　　　　<table id="forms" cellpadding="0" cellspacing="0"> 17　　　　　　　　<tr> 18　　　　　　　　　　<td>用户名：</td> 19　　　　　　　　　　<td><asp:TextBox ID="Name" TextMode="SingleLine" runat="server"></asp:TextBox></td> 20　　　　　　　　</tr> 21　　　　　　　　<tr> 22　　　　　　　　　　<td>密    码：</td> 23　　　　　　　　　　<td><asp:TextBox ID="Password" TextMode="Password" runat="server"></asp:TextBox></td> 24　　　　　　　　</tr> 25　　　　　　</table> 26　　　　　　<div id="buttons"> 27　　　　　　　　<asp:Button ID="Submit" runat="server" Text="登录" OnClick="Submit_Click" /> 28　　　　　　　　<asp:Button ID="Cancel" runat="server" Text="重填" OnClick="Cancel_Click" /> 29　　　　　　</div> 30　　　　</div> 31　　</div> 32　　</form> 33</body> 34</html> 35

 
     
     　　可以看到，在这个文件里，主要是各种页面元素的结构，但是他们的外观却没有定义。我们注意到，在这个文件的开头引用了两个外部的CSS文件，那里才是定义外观的地方。其中Common.css是全局通用外观，而Login.aspx.css是这个页面的专用外观。 
     　　这是我提倡的一种表示层设计的方法。即将结构与表现分离，其思想很类似目前的“标准化网页设计”（有人称之为DIV+CSS布局），其核心思想是一样的，只不过我这里没那么严格，并且适当的地方可以考虑使用Table布局。我的一般方法是这样的：aspx文件中只存储页面结构，不存在任何与外观有关的代码。在工程中可以有一个专门的文件夹放置CSS文件，除了通用样式外，每个文件有与自己同名的CSS文件，如Login.asxp配套的就是Login.aspx.css，这样，就可以使得结构与表现相分离。  
     　　在我的工程中，有一个Styles文件夹，专门存放CSS文件。下面把Common.css和Login.aspx.css文件的代码附上： 
     　　Common.css 
     1*{}{
2　　margin:0;
3　　padding:0;
4}
5
6h1,h2,h3,h4,h5,h6{}{
7　　font-size:12px;
8}
9
10#container{}{
11　　width:100%;
12} 
     　　Login.aspx.css 
     1#box{}{
2　　width:40%;
3　　margin:200px auto auto auto;
4　　border:3px solid #036;
5}
6
7h1{}{
8　　margin:1px;
9　　padding:5px 0;
10　　font-size:14px;
11　　color:#FFF;
12　　background:#036;
13　　text-align:center;
14}
15
16#forms{}{
17　　margin:20px auto;
18　　font-size:12px;
19　　color:#036;
20}
21
22#forms input{}{
23　　margin:10px;
24　　border:0;
25　　border-bottom:1px solid #036;
26　　width:160px;
27}
28
29#buttons{}{
30　　margin-bottom:20px;
31　　text-align:center;
32}
33
34#buttons input{}{
35　　margin:0 10px;
36} 
       
      
       
        
        　　2.表示逻辑 
        　　页面搞定了，但是要想页面发挥作用，还要有表示逻辑才行。我们登录的表示逻辑是这样的：首先根据用户输入的用户名和密码，检查是否是系统管理员（系统管理员只有一个，其用户名和密码定义在Web.config中，系统管理员可以添加、修改和删除普通管理员），如果是，则在Session中存储相应信息，并以系统管理员的身份登录后台管理页面。如果不是，则检查是否是普通管理员，如果是，则将此管理员的信息存储到Session中，以普通管理员身份返回主页。如果不是，则显示登录失败的提示。 
        　　当然，这里身份的控制还需要在后台页面和主页那边有Session检查才能完成。例如，当请求后台页时，要检查Session中相应信息是否完整，如果不完整则是非法请求，不允许访问此页面。而在主页也是，如果Session相应项中有普通管理员的信息，表明当前用户是管理员，要显示修改、回复、删除等按钮，否则是游客，则不显示这些按钮。 
        　　我们首先要配置系统管理员的用户名和密码，打开Web.config，在<appSettings>节点下添加如下项： 
        　　　<add key="AdministartorName" value="admin"/>
　　　<add key="AdministartorPassword" value="123456"/> 
        　　这里很明显，前一个是系统管理员的用户名，这里设为“admin”，而后一项为密码，设为“123456” 
        　　由于一般情况下Web.config是不允许请求的，所以这里不用担心密码泄露。 
        　　普通管理员登录的业务已经在业务逻辑层实现了，表示层可以直接调用。而系统管理员的判断、Session的操作检查及页面跳转都放在表示层里。而这一套逻辑，都放在“Submit”这个button控件的Click事件中，具体代码参考如下： 
          
         
         　　Login.aspx.cs: 
         1using System;
2using System.Data;
3using System.Configuration;
4using System.Collections;
5using System.Web;
6using System.Web.Security;
7using System.Web.UI;
8using System.Web.UI.WebControls;
9using System.Web.UI.WebControls.WebParts;
10using System.Web.UI.HtmlControls;
11using NGuestBook.Entity;
12using NGuestBook.IBLL;
13using NGuestBook.Factory;
14
15public partial class Login : System.Web.UI.Page
16{
17　　protected void Page_Load(object sender, EventArgs e)
18　　{
19
20　　}
21　　protected void Cancel_Click(object sender, EventArgs e)
22　　{
23　　　　this.Name.Text = "";
24　　　　this.Password.Text = "";
25　　}
26　　protected void Submit_Click(object sender, EventArgs e)
27　　{
28　　　　string administratorName = ConfigurationManager.AppSettings["AdministartorName"];
29　　　　string administratorPassword = ConfigurationManager.AppSettings["AdministartorPassword"];
30
31　　　　//如果是系统管理员，则以系统管理员身份登录到后台
32　　　　if (this.Name.Text == administratorName && this.Password.Text == administratorPassword)
33　　　　{
34　　　　　　Session["Administrator"] = "Administrator";
35　　　　　　Response.Redirect("~/Manage.aspx");
36　　　　　　return;
37　　　　}
38
39　　　　//判断是否为普通管理员，如果是，则以管理员身份登录到留言本，否则显示登录失败
40　　　　AdminInfo admin = BLLFactory.CreateAdminBLL().Login(this.Name.Text, this.Password.Text);
41　　　　if (admin != null)
42　　　　{
43　　　　　　Session["Admin"] = admin;
44　　　　　　Response.Redirect("~/Default.aspx");
45　　　　}
46　　　　else
47　　　　{
48　　　　　　Response.Redirect("~/Error.aspx?errMsg=登录失败");
49　　　　}
50　　}
51}