对Asp.net MVC 架构网站设计相关技术的探讨

2016-05-14 05:11孙央丽
职业·下旬 2016年7期
关键词:网站设计

孙央丽

摘 要:本文简单介绍了基于 asp.net 环境下使用MVC 架构设计一个网站所涉及的技术。并通过一个简单例子展示了设计一个网站涉及的数据库设计、EDM 对象生成、控制器创建、视图创建等内容,并对关键代码做了展示盒介绍。

关键词:asp.net MVC EDM ORM 网站设计

网络技术发展日新月异,互联网发展初期只能简单共享一些文字图片信息,现在是网页图文、声音、视频并茂。HTML5 标签直接提供了对音频和视频的支持。Css3技术使得现在的网站页面能实现手机端,电脑端自适应展示。现在的网站系统可以通过网络实现对各种后台业务系统的接口调用和系统无缝集成,并可以感知用户地理位置。现在的网页可以实现直接使用传递自定义数据模型(Model)到网页中,生成html代码来展示。现在的网站后台系统可以实现使用新的数据查询语言对自定义数据模型进行查询。

我们可能会问:使用20年前asp网站设计也可以将ADO Recordset自定义数据集嵌套在网页中展示啊?网上看看确实还有很多这样的系统。

但查看这些网站系统后台源代码,会发现这些网页往往将业务逻辑有关代码以“意大利面条式”的方式嵌套在网页HTML代码中。无论是从软件工程“高内聚低耦合”原则角度看,还是从系统升级维护角度看,这种方式都存在很多问题,维护业务逻辑也很复杂,不利业务逻辑的扩展。其实现在已经有更好的设计方式供选择,那就是基于asp.net MVC 架构开发网站。可以以面向对象方式封装业务逻辑,可以以强类型方式在网页之间传递类型数据(model),可以用razor语法把数据模型循环方式生成HTML 页面来展示从而实现对HTML 每一个元素操控,也可以使用微软的EDM对象,实现概念层到数据层的映射。

业务层的代码直接操控概念层数据模型(EF 实体模型)。可以使用linq 语法查询数据集,而不是在程序代码中嵌入sql 语句。业务层操控的不再是数据库,而是直接操控概念层概念模型。系统会实现自动完整概念层到数据库的映射和存储。

最后得到的开发体验是可以实现“关注点分离”,每一层只关注与自己有关的业务内容,这样的架构才能适应复杂的业务逻辑,才能不断应对持续变化的业务需求。

下面从实际应用角度对有关技术作简单展示,希望对初学者有帮助。

一、asp.net MVC 架构构成

MVC全名是model view controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用一种业务逻辑、数据、界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑。mvc被独特地发展起来用于映射传统的输入、处理和输出功能在一个逻辑的图形化用户界面的结构中。MVC 架构系统工作流程:当用户输入信息(浏览器中发送请求),首先获得用户输入数据的是控制器(控制器就是后台使用面向对象设计方法设计的类),然后控制器操控相应的模型(模型是根据业务概念模型设计的强类型数据类型,比如一个学生,课程,视频等)。接下来,模型的内容可以传递给指定的视图(使用razor 语法遍历模型内的数据转换成HTML 页面里的数据)返回给用户,这时用户在浏览器就看到了返回的信息。MVC虽然有很多技术细节,但是主要工作过程就如上所述。

二、使用MVC架构设计一个网站主要步骤和代码分析

下面以创建一个视频网站查询页面为例来展示使用mvc 架构创建网站方法的主要代码原理。

1.创建MVC 项目

打开 vs2015 开发集成环境依次选择新建项目---选择web----选择asp.net web 应用程序-----输入项目名称---选择MVC 项目类型---确定。操作到这里开发环境就能看到项目文件夹结构。

各个文件夹功能做好标注。没有标注的文件夹暂且放一放,可以先理解主要功能有关的文件夹,进一步再研究其他相关文件夹。

2.创建数据库并创建相应表

为了简单步骤,笔者在sql server 创建了 videos 数据库,并创建了如图1所示video表,填充了6条记录数据(如图1)。

3.根据数据库生成概念层数据实体

接下来一个重要步骤是根据创建的数据库生成实体数据模型(edm模型,是微软对ORM 思想的一种实现,创建好实体数据模型以后,应用系统将操作实体数据模型实现业务实体的增删改查,而不是直接使用SQL 语句操作数据库)。

操作步骤如下:将鼠标停留在models 文件夹,然后右键鼠标,在出现的菜单中依次选择添加—新建项—ADO.NET 实体数据模型——来自数据库的EF设计器——连接前面创建好的数据库—选择要映射的表—点击完成。

操作到这里已经完成数据实体的创建。接下来只要操作概念层数据实体就能完成对数据库的增删改查。而数据实体则是面向对象设计的,数据库里面的表字段变成了对象的属性,在程序业务代码中,也是操纵控这些实体对象,而不是数据库里面的表,他们之间的映射,系统会自动完成。这就是微软根据ORM 思想设计的实体数据模型,简称EDM(详细细节不展开介绍,请大家查找有关资料)。

从图2可以看到 videos模型有Id,videoName,picture,creater,createDate 5个属性,分别对应着数据库表5个字段。

打开代码窗口可以看到实体数据模型其实就是一个类,和面向对象设计中的实体类没有本质区别。

操作到这里,笔者已经准备好了数据库,也准备好了概念层数据实体和数据实体模型对应的数据上下文对象(数据上下文对象可以加载数据到实体数据模型中)。目前还缺一个动作,就是调用该方法,得到数据并将这些数据显示在页面中。下面继续完成这个动作。

4.设计控制器,访问到数据,将数据模型传递给视图

将鼠标停留在Controller 文件夹依次选择:添加—控制——包含视图的MVC5 控制器(使用Entity Framwork)——添加。完成上面操作在Controll 文件夹就多出了一个控制器文件。

5.设计视图,将数据模型生成HTML 页面

完成上面操作向导,我们查看Views文件夹,可以看到多了一个videos 子文件夹,里面有一个名为 index.cshtml 文件。通过这一步骤应该注意以下知识点。

(1)razor语法其实就是c#语句前面加@就能将c# 语法和html 混合编写,既能将模型数据转换成HTML 页面数据显示。

(2)视图文件的第一行有个IEnumerable接口类型的声明,用接口类型就能接收控制器传递过来的模型数据。

(3)微软已经为我们设计了一套生成 HTML 标签的编程接口。

6.运行网站

以上操作已经完成后台数据库的创建、概念层EDM 到数据库的映射数据模型的创建、控制器的创建、视图的创建并且将网站页面运行起来了。虽然简单,希望对初学者有所帮助。

猜你喜欢
网站设计
企业网站建设的探讨
网站设计课程内容优化探讨
可复用的高职网站后台管理系统的设计
《计算机应用基础》自主学习网站的研究与设计