
本科毕业设计(论文)
题 目 __ 校园网站的设计与实现__ _
学生姓名 赵晓亭
专业班级 软件工程专业11-1班
学 号 *********3
院 (系) 信息工程系
指导教师(职称) 王文凡(讲师)
完成时间 2015年5月10号
校园网站的设计与实现
摘 要
本篇论文主要描述的校园网站建立的背景及设计的过程和设计之后的测试与发布,同时还包括发布的过程以及这个过程中所涉及到的理论知识的阐述。其中涉及到很多细节的设计过程。设计包括的几个模块,其中包括:校园网站系统背景的设计分析、校园网站系统能实现功能的设计、基本框架的搭建、数据库的设计、各模块功能的实现、数据库的连接、数据的填充与界面的完善、网站测试和调试。通过本校园网站管理系统的特点:实现了对外公开性新闻系统,可以作为公开的网络门户。使用的过程是通过网站后台管理来实现新闻的发布、模块的管理生成与查询,从而使网站可以更广泛地通过 Internet传播和交流信息。本网站的开发工具主要有Visual Studio 2010、Adobe Photoshop、SQL Server 2008等。
关键词 ASP.NET;Visual Studio;数据库
Design and implementation
of campus website
ABSTRACT
This paper describes the campus Web site established background and design process and design after testing and publishing, but also includes the process set forth in this release, and the process involved in the theory of knowledge. This involves a lot of details of the design process. Design includes several modules, including: campus website system design and analysis background, campus website system enables building design features, the basic framework of the filling connection database design, implement each module functions, databases, and data improve the interface, website testing and debugging. By features of the campus Web site management system: to achieve the openness of foreign news system, as public Web portal. Process used by Site Admin to realize the news release, management generates a query module, so that the site can be more widely spread and exchange of information through the Internet. This site development tools are Visual Studio 2010, Adobe Photoshop, SQL Server 2008 and the like.
KEY WORDS ASP.NET, Visual Studio, database
1 绪论
选题背景
作为国家重视教育文化程度、校园网站逐年增加,校园网站可以与外界交换信息和交流沟通为学校建立一个有效的沟通平台。如今,随着人们生活的信息化,足不出户网上购物和网上预约驾校等网络活动已经充满着我们的生活。而校园网站,能满足学生、老师、家长以及外界随时随地的运用互联网查询你所关心的校园资讯,尤其是家长可以通过校园网站了解学校的动态,关心自己孩子所生活的环境,从而很好的帮助学生选择更适合自己的校园。校园网站可以及时的在网上发布信息及通知,快捷有效。网站上的信息主要是通过在互联网上获取信息按照一定的信息检索方法需要从网站下载。为了更好的教育,提高学校知名度,校园网站的实现势在必行。
PS是一个简单实用,很容易上手的图像处理软件。本网站主要就运用PS设计前台的页面,使页面美观而又大方,后台则使用ASP开发。ASP能够给网页增加新的功能,而且还能输出HTML标记,能够很好的与HTML结合使用[1]。
选题的意义
校园网站的设计和实现更全面的宣传和展示风采,校园的优点和特性。同时可以通过校园网站发布本学校的重大活动的安排、招生。老师们可以在Internet上完成一部分教学任务或者作业安排,提高办事效率。
ASP.NET是微软公司发布的一款新一代的系统、服务和编程平台,ASP.NET主要是由.NET Framework和Microsoft Visual Studio .NET这两种开发工具组成的。ASP.NET任何开发工具都可配合发展,主要是由于:ASP.NET执行结果所产生的HTML适用于很多不同的浏览器;ASP.NET的安全性能很高,它的原始代码是看不到的;ASP.NET可以连接各种不同的数据库,本网站连接的是极为简单好用的SQL Server数据库,除此之外它还可以连接access和Oracle等数据库。
2 网站设计相关知识与技术
2.1 ASP.NET的简介
ASP.NET是微软公司2002年推出的一款应用程序开发技术。ASP.NET简单易学,配合C#等开发语言一起开发,促进了语言的应用,使得网站开发更加的容易操作,促进了网站技术的发展[2]。
ASP.NET的特点
(1)ASP.NET具有强大性和适应性。ASP.NET的强大性在于可以使用很多种语言进行开发[3]。
(2)ASP.NET具有易学性和简单性。ASP.NET的强大性和适应性,决定它的易学性和简单性,ASP.NET功能强大框架经过多次扩充与简易化,给初学者提供了很多的方便[4]。
(3)ASP.NET具有高效可管理性。ASP.NET的分级配置系统使得服务器环境设置变得非常的容易操作,因为它的分级配置系统是以数字为基础的而且配置信息可以再简单文本中查看,所以新的设置有的可能都不需要启动本地的管理员工具就可以很快的实现[5] 。
ASP.NET不是ASP的简单升级版,它是全新一代的动态网页实现系统,是基于WEB服务器建立的应用程序。ASP是微软公司1996年末推出的一款WEB开发程序,当初它的到来给WEB世界带来了翻天覆地的变换,它推进了WEB应用技术的发展。而ASP.NET是ASP和.NET技术结合的升级。它的到来又一次推动了WEB应用技术的发展与壮大,大大降低了编程难度,使得更多的人都可以进行编程,导致WEB程序价钱的降低,使得更多的中小型企业都应用了网站。刷新了互联网的令一个高度。还可以用ASP.NET建立网络服务。
2.2 PHOTOSHOP的简介
PS是 Adobe Photoshop的简称,同时是Adobe Systems开发并发行的图像处理软件,Photoshop主要处理的图像是由像素所构成的数字图像, PS通过使用其众多的修改以及绘图工具,可以有效快速地进行图片编辑工作[6]。PS有在图像、文字、视频、出版、图形等各方面有很多特有的功能。PS的特长在于图片的处理和再加工,可以用于网站图片的美化与设计。
PS的使用越来越广泛,主要特点如下:
(1)功能强大的选择性工具。Photoshop拥有多种多样的选择工具,极大地满足了用户的不同要求。而且多种选择工具还可以结合起来选择 较为复杂的图像。
(2)可以制定形式多样的文字效果。因为Photoshop的很多种工具可以配合使用制作出精美的文字造型,而且还有强大的文字处理工具可以对你所选择的文字进行复杂多样的变换,极大的提高了客户的趣味性。
(3)PS具有多姿多彩的滤镜。 Photoshop的滤镜是其非常重要的特征,因为它拥有多种多样的内置滤镜,而且还有支持第三方的滤镜这就大大的满足了客户的需求。这样,Photoshop就拥有了用不完的滤镜。
(4)PS简单易学,用途广泛。Photoshop上述的特征注定它的用途广泛。许多不太了解的人对Photoshop具有一种神秘感,任务这是一种专业人士使用的工具,这是一种错误的观念。因为它的强大,所以对普通图像处理工具所具有的功能它也具备而且操作更加的简单。而且专业的图像处理技术它也很简单,因为开发的完整性所以很多工具都很容易操作。可以说Photoshop可以满足不同水平和要求的客户的需求。
2.3 Visual Studio简介
Visual Studio是由微软公司推出的开发环境。是目前流行的Windows平台应用程序的开发环境。Visual Studio支持Microsoft SQL Server、 IBM DB2、Access和Oracle数据库[7]。本网站使用的开发工具就是VS2010学习版,它是一款免费的软件,可以配合好几种语言一起开发,非常方便实用。VS作为一款最有资历的静态网站开发工具,有其强大的开发功能和完整的设施。
VS2010的安装有时候也是一个非常重要的问题,有很多人都出现了安装失败等现象,下面是VS2010安装的一些步骤:首先,我们要确保安装包的正确性,最好从MSDN官网上下载VS2010安装包[8]。其次根据步骤一步一步的安装,如果你需要完整的程序你就可以选择完全或者你只需要一些特定的功能你就可以选择自定义。最后需要一定的等待时间,安装完全之后需要重启电脑,完成之后整个安装过程也就结束了。
2.4 网站设计环境
网站前期设计制作工具我选用的是VS2010、Photoshop 9.0 CS、Flash MX、SQL Server数据库等。
网站运行环境配置基本要求如下:
(1)服务器的配置:
基本配置: Windows 2000或更高的版本,IIS 5.0或更高的版本, SERVER 7.0或更高版本。
推荐配置: Windows 2000+IIS5.0+SQL SERVER 2000。
(2)客户端管理计算机配置
配合使用MS IE5.以上版本,必须支持JAVASCRIPT,VBSCRIPT脚本,并关闭所有弹出窗口的阻拦程序。
(3)空间的要求
必须支持FSO(Scripting. File System Object),空间初始大小85M。
数据库空间大小:10M。
3 概要设计
3.1 网站整体设计准备
根据系统开发的基本知识和学校领导对网站的一个基本需求,从内容上可对网站作如下划分:
(1)游客浏览:为校园网站设计一个非常吸引人的页面,提供给想要了解本校园信息的游客。
(2)管理员登入:管理员通过登入特定账号对其他普通权限的账号进行权限设置和管理,同时管理员同时操作网站新闻和图片的新增维护等权限。
(3)意见反馈:个人登入个人账号可以对校园新闻进行评论或者留言。
(4)新闻发布 :发布校园内部消息或者时事政治,使得大家能够更加全面及时的了解到校内或校外的信息。
(5)校园风采:通过上传你所拍下来校园的形象与大家进行互动上传,让校内甚至校外更加深入和多方位的了解我们的校园。
3.2 校园网站设计方案
本校园网站主要服务的人群是本校的学生、老师以及外部浏览人群,设计构思非常简单容易操作,功能较容易实现。本网站设计的主要目的是用于本校学生老师的登入以及管理员进入对访客权限的控制与更改,同时有访客页面,主要是针对校外人员对本网站对的浏览以及评论。本网站设计主要是实现如下功能:管理注册、管理员登入、新闻发布、意见反馈。网站结构功能图如图3-1所示。
图3-1 网站主要功能结构
3.3 数据库的设计
数据库是一个网站是否有可持续发展的一个重要依据[9]。本网站的设计也与数据库息息相关,但是由于本网站想要实现的功能很简单,所以所需要的数据也不是很复杂。
本网站与数据库交互主要有三个部分,其一是管理员部分,在这个部分主要是为了验证管理员的密码是否和后天密码匹配和新增管理员权限;其二是相册部分,相册的录入是录入到数据库里面的,这样可以其他网页的调用,同时也实现了网站动态显示的效果;其三是新闻部分,新闻部分和相册部分很相似,新闻可以动态的显示。所以根据以上三个部分的要求,在数据库里设计了三个表,分别为管理员表、相册表、新闻表。这是整个网站所用的数据库的情况,我的设想是根据以后对网站功能的增加,可以同时对数据库功能的增加。
论文中所用到的管理员表表名为admin,其中有usher id和pw两个属性,其中usher id是主键,唯一区别于其他的属性。该表的设计严格按照用户的需求,主键控制了用户名的唯一存在且不能为空,而密码也不能为空,其具体的表格式如表3-1所示。
表3-1 admin
| 列名 | 数据类型 | 允许空值 | 主键 |
| Userid | Varchar(10) | N | Y |
| pw | Varchar(10) | N | N |
表3-2 photo
| 列名 | 数据类型 | 允许空值 | 主键 |
| id | int | N | Y |
| title | Varchar(60) | N | N |
| pic | datetime | Y | N |
| content | text | Y | N |
表3-3 blog
| 列名 | 数据类型 | 允许空值 | 主键 |
| id | int | N | Y |
| title | Varchar(60) | N | N |
| bate | datetime | Y | N |
| content | text | Y | N |
4.1 网站整体结构设计
网站主页采用静、动相结合的方式来设计,即静态的主界面和动态的图片相结合[10]。主界面的设计分为三个模块:校园风采图片展示、校内校外新闻展示、管理员登入。
校园风采图片展示是为了更好的让外界了解到本校园的文化以及校园环境的最好途径。所以校园风景展示是一个必不可缺的设计环节也是决定整个页面设计美观程度的一个重要因素。
校内校外新闻展示则体现了一个校园的文化氛围,也可以让外界了解到校内丰富多样的活动以及积极向上的学习氛围。而校外新闻则可以让学生更加及时有效的了解到国内外的政治以及新闻,丰富大家的课外生活,可以更好的让让学生与社会接上轨。
管理员登入是这个主页最重要的部分,管理员登入之后可以对其他等级较低的管理员的权限进行管理,同时有些有权限的管理员拥有上传和更新新闻和图片的权力,使得大家能够了解到最新的消息新闻和图片。同时游客还可以通过注册账号来使得自己评论新闻的权限,是大家可以交流自己的思想,发表自己的理解和看法。
4.2 主要模块介绍
4.2.1 首页界面设计
主界面是一个校园网站的脸面,所以要设计的简单大方。本首页界面是所有功能的展示界面,通过点击图片可以跳转到详细的图片介绍界面,可以了解到图片的详细信息[11]。同样点击新闻标题可以跳转到详细的新闻界面,可以详细的阅读新闻,同时可以发表自己的评论:其首页如图4-1所示。
图4-1 网站首页
首页界面的代码如下:
上面代码是对网站首页设计的各个层的格式定义,在这里所上传的代码皆为前台代码,后天代码则在附录中提供。下面代码则是对网页主体的设计与布局。网站首页的最上方使用的是下拉式菜单,单击可以进入到具体的界面。首页下方则是校园的招牌图片,向外界展示一个校园基本环境。
登陆、注册、更多操作,是为了给网站提供一个更加明了的操作目标,用户可以直接点击进行下一步的动作。
4.2.2 管理员登入注册界面
管理员通过登入可以进入到管理员权限界面,可以增加或修改或删除新闻和图片等其他功能,对主页面进行管理与监控。管理员登录及注册界面效果图如图4-2所示。
图4-2 管理员登录界面
登入界面代码如下:
后台代码如下:
public partial class adminInput : System.Web.UI.Page
{//管理员登入的时候与数据库里表的数据进行核对,通过后台代码对数据库进行操作,通过SQL语句将前台得到的值传入后台,然后跟数据库里的值进行对比,如果用户名和密码匹配,则登入成功。
protected void Button1_Click(object sender, EventArgs e)
{ String userid, pw, sql;
if (TextBox1.Text = = “ “ )
{
Response.Write(“ “ ) ;
}
if (TextBox2.Text = = “ “ )
{
Response.Write(“ “ ) ;
}
//user = TextBox1.Text;
//pw = TextBox2.Text;
sql = “ select * from admin where userid = '“ + TextBox1.Text + ” 'and pw = '“ + TextBox2.Text + ” '“ ;
//输入界面的值需要拿到后台,用上述语句对用户名和密码进行和数据库的匹配,如果匹配成功,则选出的行数一定大于等于1,如果匹配不成功,则选出的行数为空,则说明用户名输入错误,或者密码输入错误。
DataTable dt = BaseClass1.ReadTable(sql) ;
if (dt.Rows.Count! = 0)
//密码正确才能登陆
{
Response.Write(“ “ ) ;
Response.Redirect(“ gengduo.aspx ” ) ; //跳转到更多操作
}
else
{
Response.Write(“ “ ) ;
//Response.Redirect(“ adminInput.aspx ” ) ;
}
//善后处理
TextBox1.Text = “ “ ;
TextBox2.Text = “ “ ;
//Response.Write(“ “ ) ;
}
}
管理员注册界面的作用则是通过界面直接往数据库里插入数据的过程。可以注册一个属于自己的账号,存入数据库,可以为以后登入做准备,然后可以进行操作。管理员注册效果图如图4-3所示。
图4-3 管理员注册效果图界面
管理员登入界面的后台代码如下:
管理员密码和用户名存入数据库,后台代码通过if语句对前台输入的用户名和密码进行初步判断,来用户名不能为空,密码不能少于六位。然后如果符合规定,则将注册的数据存入数据库。
public partial class adminlog : System.Web.UI.Page
{protected void Button1_Click(object sender, EventArgs e)
{// ” 用户名 ” 不能为空, ” 密码 ” 不能少于6位,根据数据库中的定义长度
String userid, pw, sql;
if (TextBox1.Text = = “ “ )
{Response.Write(“ “ );}
if (TextBox2.Text.Length < 6)
{Response.Write(“ “ );}
userid = TextBox1.Text ;
pw = TextBox2.Text ;
sql = “ insert into admin ([userid],pw) values ('“ + userid + “ ','“ + pw + “ ') ” ;
BaseClass1.execsql(sql);
//善后处理
TextBox1.Text = “ “ ;
TextBox2.Text = “ “ ;
Response.Write(“ “ );
Response.Redirect(“ 02blog.aspx ” );
}
}
管理员权限界面有很多种选择,增加新闻、增加相册、删除相片、删除新闻、返回首页的功能,前台代码的设计很简单,管理员权限效果图界面如图4-4所示。
图4-4 管理员权限效果图界面
其代码如下:
4.2.3 图片详细信息界面及录入界面
图片详情是首页界面所展示的图片的详细信息,有图片的详细介绍和描述,通过这个界面可以查看具体的信息,使得师生可以更加了解校内信息。图片录入界面则是管理员登入后进入图片录入这一界面,主要是为了更新或者删除界面上所展示的图片。图片详细信息界面效果图如图4-5所示。
图4-5图片详细信息界面
图片详细信息界面代码如下:
定义相册录入的格式,以及控件的管理,和前台布局,图片录入时选择图片上传控件和相册内容格式控件,对上传的图片格式和文字格式进行控制。
相册的录入时这个程序新鲜血液的注入。相册的录入可以使得整个网站变成“活水”,同时这个操作时需要管理员的操作来实现的。需要管理员的辛苦操作。
4.2.4 新闻详情信息界面及新闻录入界面
新闻详细信息是主界面是新闻标题的详细内容的展示,同时还增加了新闻评能,方便大家进行交流。而新闻录入界面和图片录入界面类似。新闻详细信息界面效果图如图4-6所示。
图4-6 新闻详细信息界面
新闻详细信息界面代码如下:
新闻录入的界面设计和后台设计与图片的录入界面基本相同,属于管理员直接操作的内容。新闻录入后台代码主要是对上传相册录入到数据库中,方便以后的使用和空间容量的节省,新闻录入界面效果图如图4-7所示。
图4-7 新闻录入界面
对应的后台代码如下:
public partial class blogInput : System.Web.UI.Page
{BaseClass BaseClass1 = new BaseClass();
protected void Page_Load(object sender, EventArgs e)
{
protected void bt_s_Click(object sender, EventArgs e)
{ //String ID = TextBox1.Text;
String title = TextBox2.Text;
//String Dept = DropDownList1.SelectedValue;
String bdate = TextBox4.Text;
String content = t_Resume.Value;
//String picfile = Img_upload.Src;
String sql = "insert into blog(title,bdate,content) values('" + title + "','" + bdate + "','" + content + "')";
BaseClass1.execsql(sql);
//TextBox1.Text = "";
TextBox2.Text = "";
TextBox4.Text = "";
t_Resume.Value = "";
Response.Write("");
Response.Redirect("blog.aspx");
}
}
5 网站测试与发布
5.1 网站测试
网站测试是网站发布前必不可少的一部分,通过测试可以避免一些不必要的错误的产生,也可以提前更正减少预算。同时也可以多方面的了解自己的网站,方便网站以后的全面发展。本校园网站的设计结构比较简单,所以测试也相对简单化。我主要对校园网站的性能和前后台交互的速度测试。
网站性能测试主要是对网站本身性能的测试,比如说图片格式、超链接的正确性、LOGAL图片是否正确显示、基本模块的功能是否完善。通过这次测试,我了解到了本网站的不足。也了解到了自身知识的缺乏,以后我会更加努力的学习,方面以后更好的完善本网站。
5.2 网站的安装与发布
网站的建立包括网站的源代码、域名、主机。网站的源代码即本网站本身,而域名则需要从网上申请,主机则是一个性能较好的服务器。网站的安装的具体情况如下:
Windows 2003操作系统:
A. 将本校园网站拷贝到硬盘上的某一目录下,如:拷贝至c:\\A下。
B. 运行PWS,然后将默认的Web站点的主目录设置为该目录,如上例应为c:\\A;
具体步骤:
1. 选择高级选项。
2. 单击编辑属性 选项 ,在出现的编辑属性对话框中的目录项中填入 c:\\A ,其他的不该变,点击确定。
3. 设置启动默认的文档为:index.asp。
Windows XpSp2操作系统:
在安装网站的时候必须准备系统安装盘,先安装IIS 然后再对IIS进行设置。
具体方法如下:
放入光驱中的系统盘会弹出页面,然后选择安装系统组件Internet 信息服务。安装之后,在管理工具中就可以看见安装好的IIS组件。再通过IIS属性的主目录(指定网站解压目录)文档(在启用默认文档中添加index.asp 方可正常运行显示该网站)。
对于网站的发布,首先要做的就是选择一个好用的网站上传工具。而本网站所选择的网站工具是Flash FXP 2.1注册版,该工具是一款非常强大的FTP、FXP软件上传工具,它集成了其他FTP软件的所有优点。Flash FXP是很多网友的选择,因为它操作起来非常简单,而且它所提供的环境是非常稳定的。不管是你是为了娱乐大家还是为了挣钱,它都能够快速高效的完成工作。然后就是这个软件的操作过程。首先需要设置软件提供商给我们提供的密码和账号,然后根据步骤如下图5-1所示。
图5-1 登入界面
结 论
本校园网站的设计主要使用的是Asp.NET、SQL SEVER2000、PS等软件。本篇论文主要是介绍了网站设计的过程,以及网站设计所使用的基本知识。为了这次校园网站的设计我翻看了很多本书,也在网上找了很多资料。网站设计的步骤需要严格按照要求,需要有一定的逻辑思维。校园网站管理系统的特点:本网站的实现方法很简单,主要功能都有实现,能够满足一般校园网站的要求。可以很好的实现学生以及校园和外界人士对校园网站的基本需求。同时该网站也可以应用到其他的领域比如:展现个人风采网站;小型企业门户网站;小型空间展示等。校园网站的设计与实现虽然满足了一些功能,但是仍然有所不足。但是在这个过程中我学会了很多东西,我会继续努力的,我相信通过我的学习在不久的未来会使得我的网站更加的完善。
致 谢
在这次毕业论文的学习和设计实现的过程中,我要特别感谢我的指导老师王文凡老师,从开始选择题目到中期的英文文献和文献综述,到最后的论文的实现,老师给了我很多参考的意见和建议。使我从开始的迷茫不知所措到最后找到方向并完成设计,非常感谢老师对我的帮助。同时也要感谢学校的栽培,在以后的工作和生活中,我要像你们一样以饱满的热情与激情投入到工作中,用我最好的成绩回报老师和学校对我的期待与教诲。最后祝王老师生活和工作中健康快乐、工作顺利。祝愿学校越来越好。
赵晓亭
年5月
参考文献
[1] 王国荣,张宝刚.ASP 网站制作教程[M].北京:人民邮电出版社,2001,5-10
[2] 李春葆,谭成予,金晶.C#程序设计教程[M].北京:清华大学出版社,2009,10-20
[3] Jeffrey D. Ullman and Jennifer Widom. A first course in database systems [M]. China Machine Press,2006,10-15
[4] 代志勇.ASP.NET.动态网站开发教程[M].北京:清华大学出版社,2011,15-30
[5] 崔淼,关六三,彭炜.ASP.NET程序设计教程(C#版)[M].北京:机械工业出版
社,2010,120-280
[6] 刘乃丽.完全手册ASP.NET 2.0网路开发详解[M].北京:电子工业出版社.2008,5-100
[7] 肖建. ASP.NET编程基础[M].北京:清华大学出版社,2002.1,1-120
[8] 王珂等.新世纪PhotoshopCS2中文版应用教程[M]:电子工业出版社,2006,25-30
[9]Abraham Silberschatz,Henry F.Korth,S.Sudarshan.数据库系统概念-第3版[M].北京:机械工业出版社,2008,30-40
[10] (美) Rime Elmasri(美), Shamkant B Navathe:数据库系统基础.初级篇[M].北京:人民邮电出版社,2007,40-46
[11] 萨师煊、王珊.数据库系统概论[M].高等教育出版社.2004.12,204-209.
[12]Thomas Connolly,Carolyn Begg. Database system: a practical approach to design, implementation, and management [M]. Publishing House of Electronics Industry,2008,10-15
[13]王功明,关永,赵春江.面向对象数据库的关键技术研究[J].微计算机信息,2006,22(3):197-199
[14]周辉君.数据库系统优化方法研究[J].科技信息,2008(17):70
[15]于海滨.基于数据库系统的自定义文件属性[J].电脑编程技巧与维护,2008(9):39-42
