校友之家网站的设计与实现毕业论文.doc

校友之家网站的设计与实现毕业论文目 录1 概 述12 课题研究背景与意义12.1 课题研究背景12.2 课题研究意义23盐城工学院校友之家网站系统可行性研究23.1技术可行性研究23.2操作可行性研究34盐城工学院校友之家网站系统需求分析34.1功能需求34.2用户角色与权限需求分析45盐城工学院校友之家网站系统设计45.1校友之家网站系统前台设计55.2校友之家网站系统后台设计65.3校友之家网站系统的数据库设计85.4校友之家网站系统公共设计156校友之家网站系统的具体实现166.1系统注册功能模块166.2信息平台功能模块216.3校友分会功能模块的实现246.4后台管理登陆模块的实现266.5校友管理功能模块的实现287校友之家网站系统的测试与分析307.1系统测试方案及测试结果分析307.2校友之家网站系统的测试308结束语31参考文献32致 谢33附 录34附录1源程序代码清单34附录1.1说明书中所涉及的代码34附录1.2验证码技术代码56附录1.3系统前台样式代码57附录1.4系统前台登陆验证代码62附录1.5 注册功能服务器端验证代码64附录1.6系统防止SQL注入代码66附录1.7系统后台信息平台管理代码661 概 述 盐城工学院校友之家网站是围绕“如何更好的实现校友与校友之间的沟通与交流、实现信息共享”这样一个主线，创建校友和校友之间的合作平台，发挥校友和母校之间的桥梁作用，将母校和各地校友及校友会更紧密地联系起来。盐城工学院校友之家网站拥有自己的论坛，在校友论坛里校友们可以畅所欲言，对学校建设、当前时政谈谈自己的看法，校友彼此之间可以有更多的交流机会。盐城工学院校友之家网站还设有信息平台栏目，该栏目供校友发布供求信息，实现资源共享，校友之间互通有无，互相帮助。利用这个信息发布平台，校友可以发布供求信息，这样网站就具有出现商机的可能，而在校友的网站上，每个校友的身份信息都是经过管理员严格认证的，所以本网站所提供的商务信息具有相当高的可信度。但是本平台不具有任何的商务盈利性质，我们旨在为广大校友提供一个商机涌现的平台，为我们的校友提供一个更广阔的交流空间。校友之家网站实现的功能 ：校友身份审核功能、校友可以凭用户名和密码登陆并发布信息（包括文字和图片）、各类活动的前期推广、各类信息的发布和整合、母校和各地校友会的活动介绍。校友之家网站前台栏目设置：校友撷英：该栏目介绍工作在各行各业的校友及优秀在校生；校友论坛：该栏目做成BBS形式，校友可以各抒己见，充分沟通交流；信息平台：该栏目供校友发布供求信息，实现资源共享，校友之间互通有无，互相帮助；校园动态：该栏目主要向校友介绍学校最新发生的大事及动态，让校友了解母校的发展；校友分会：该栏目介绍各地校友会的概况及最新动态、校友返校聚会信息及校友的其他活动。盐城工学院后台功能主要有：注册校友管理：此功能用于对已注册校友的信息进行审核，对校友进行锁定解锁，删除等；信息平台管理功能：此功能主要是对信息平台上信息和回复的功能进行管理，包括信息的审核，修改，删除；新闻管理功能：此功能主要用于新闻的添加、修改和删除；论坛管理功能：此功能主要用于论坛的管理，其中包括帖子管理、回复管理、版主设置和论坛模块设置等功能；校友分会管理：此功能主要用于管理各个分会的信息，包括分会信息的添加、修改和删除。校友分会活动剪影的添加、修改和删除。2 课题研究背景与意义盐城工学院校友之家网站是应盐城工学院校友办的要求开发的，针对原校友会网站在功能和安全防护上的不足，提出了对盐城工学院校友之家网站在功能上和安全防护上等各方面的开发指标。2.1 课题研究背景原校友会网站在功能上存在诸多不足，愈来愈无法满足校友办的工作需求和校友之间相互进行密切交流的渴望。原校友会网站主要存在以下几点不足：a无法完成对校友意见的采集，给校友办各方面工作的展开带来了很大的困难。b没有提供一个校友之间能够互通有无的平台，很大程度上影响到校友使用网站的积极性，这点也是网站实用性的重要体现。c校友会网站的论坛和校友会网站是完全分离的，登录校友会网站以后要使用论坛功能仍需要再次登陆，除此以外论坛需要重新注册，给校友之间的相互交流带来了很大不便。d网站在安全防护上存在诸多不足之处。比如没有做防止SQL注入，前台安全性检验不完善等等。e在前台没有提供校友搜索的功能，给需要寻人的校友带来了诸多不便。f网站在后台没有对管理员进行分级，不利于网站的安全维护。2.2 课题研究意义盐城工学院校友之家网站是围绕“如何更好的实现校友与校友之间的沟通与交流、实现信息共享”这样一个主线，创建校友和校友之间的合作平台，发挥校友和母校之间的桥梁作用，将母校和各地校友及校友会更紧密地联系起来。盐城工学院校友之家网站拥有自己的论坛，在校友论坛里校友们可以畅所欲言，对学校建设、当前时政谈谈自己的看法，校友彼此之间可以有更多的交流机会。盐城工学院校友之家网站还设有信息平台模块，该栏目供校友发布供求信息，实现资源共享，校友之间互通有无，互相帮助。利用这个信息发布平台，校友可以发布供求信息，这样网站就具有出现商机的可能，而在校友的网站上，每个校友的身份信息都是经过管理员严格认证的，所以本网站所提供的商务信息具有相当高的可信度。但是本平台不具有任何的商务盈利性质，我们旨在为广大校友提供一个商机涌现的平台，为我们的校友提供一个更广阔的交流空间。校友办在工作中发现校友都希望能够通过网站寻找到以前的同窗好友，所以我们特意在盐城工学院校友之家网站上添加了寻找校友的功能，只要是在校友之家网站上注册的校友，你都可以通过他的姓名或班级信息查找到。与此同时我们还在信息平台上开辟了一个名为“寻找校友”的模块，专门为需要寻找校友的校友提供服务，他们可以直接在这个模块发布寻人信息，其他校友可以跟帖来提供被寻校友的相关信息。3盐城工学院校友之家网站系统可行性研究3.1技术可行性研究盐城工学院校友之家网站使用ASP技术进行编程开发，使用SQL Server 2005作为后台数据库支持。ASP是Active Server Page的缩写，意为“动态服务器页面”。ASP是微软公司开发的代替CGI脚本程序的一种应用,它可以与数据库和其它程序进行交互，是一种简单、方便的编程工具。ASP的网页文件的格式是.asp，现在常用于各种动态网站中。ASP是一种服务器端脚本编写环境，可以用来创建和运行动态网页或Web应用程序。SQL Server 2005包括了一些在安全性能上的改进，例如数据库加密、设置安全默认值、增强密码政策、缜密的许可控制、以及一个增强型的安全模式。新的SQL Server Management Studio SQL Server 2005引入了SQL Server Management Studio，这是一个新型的统一的管理工具组。这个工具组将包括一些新的功能，以开发、配置SQL Server数据库，发现并修理其中的故障，同时这个工具组还对从前的功能进行了一些改进。专门的管理员连接。SQL Server 2005将引进一个专门的管理员连接，即使在一个服务器被锁住，或者因为其他原因不能使用的时候，管理员可以通过这个连接，接通这个正在运行的服务器。这一功能将能让管理员，通过操作诊断功能、或TransactSQL指令，找到并解决发现的问题。SQL Server 2005中的新安全模式将用户和对象分开，提供fine-grain access存取、并允许对数据存取进行更大的控制。另外，所有系统表格将作为视图得到实施，对数据库系统对象进行了更大程度的控制。Transact-SQL 的增强性能。SQL Server 2005为开发可升级的数据库应用软件，提供了新的语言功能。这些增强的性能包括处理错误、递归查询功能、关系运算符PIVOT, APPLY, ROW_NUMBER和其他数据列排行功能。3.2操作可行性研究盐城工学院校友之家网站采用被广泛使用的B/S模式开发，在前台校友只需要打开浏览器输入就可以访问校友之家的首页，登录后就可以使用系统为校友提供的各项功能。在后台校友办工作人员输入后台登陆URL，登陆后就可以使用管理网站的各项功能。因为浏览器被广泛使用所以校友之家网站所提供的功能界面对校友来说是简洁易懂的，而且在开发设计时我将尽量将人性化的功能设计考虑进去。4盐城工学院校友之家网站系统需求分析4.1功能需求通过和校友办的相关领导和工作人员沟通交流后了解到他们希望校友之家网站所要完成的功能有： a校友撷英：该栏目介绍工作在各行各业的校友及优秀在校生。b校友论坛：该栏目做成BBS形式，校友可以各抒己见，充分沟通交流。c信息平台：该栏目供校友发布供求信息，实现资源共享，校友之间互通有无，互相帮助。d校园动态：该栏目主要向校友介绍学校最新发生的大事及动态，让校友了解母校的发展。e校友分会：该栏目介绍各地校友会的概况及最新动态、校友返校聚会信息及校友的其他活动。4.2用户角色与权限需求分析通过与盐城工学院校友办的相关领导交流之后确定盐城工学院校友之家网站的用户角色应该分为五种：游客、普通校友、论坛版主校友、普通管理员、超级管理员。各个角色所拥有的权限描述如下：a. 游客权限：访问网站的首页，浏览网站公告，使用注册功能，取回登录密码。b. 普通校友权限：浏览网站新闻，浏览网站公告，浏览校友风采，浏览校友风采，浏览校友捐赠，浏览信息平台信息，发布信息，发表信息回复，站内校友查询，浏览校友分会，浏览分会活动剪影，在论坛内发表帖子，在论坛内发表回复，修改个人信息，发表留言（可选择是否保密），查看留言回复，查看站内通知，修改个人登录密码。c. 论坛版主校友权限：浏览网站新闻，浏览网站公告，浏览校友风采，浏览校友风采，浏览校友捐赠，浏览信息平台信息，发布信息，发表信息回复，站内校友查询，浏览校友分会，浏览分会活动剪影，在论坛内发表帖子，在论坛内发表回复，修改个人信息，修改个人登录密码，发表留言（可选择是否保密），查看留言回复，查看站内通知，管理其论坛板块的所有帖子和回复。d. 普通管理员权限：管理网站公告，查看系统帮助，修改部门简介，管理信息平台的信息，管理信息平台的回复，管理信息平台的信息类别，管理站内通知，发送站内通知，管理校友风采，添加校友风采，管理校友感言，添加校友感言，管理注册校友，新闻管理，添加新闻，留言管理，回复留言，发布留言板公告，分会管理，添加分会，分会活动剪影管理，添加分会活动剪影，管理校友捐赠，论坛帖子管理，论坛回复管理，论坛版主设置，论坛版块管理，论坛各版块的分类管理，校友企业图片管理。e. 超级管理员权限：网站管理员管理，上传图片管理，数据库备份，数据库还原，数据库备份文件管理，管理网站公告，查看系统帮助，修改部门简介，管理信息平台的信息，管理信息平台的回复，管理信息平台的信息类别，管理站内通知，发送站内通知，管理校友风采，添加校友风采，管理校友感言，添加校友感言，管理注册校友，新闻管理，添加新闻，留言管理，回复留言，发布留言板公告，分会管理，添加分会，分会活动剪影管理，添加分会活动剪影，管理校友捐赠，论坛帖子管理，论坛回复管理，论坛版主设置，论坛版块管理，论坛各版块的分类管理，校友企业图片管理。5盐城工学院校友之家网站系统设计盐城工学院校友之家网站系统分前台和后台两个主要平台。系统的前台为校友提供各种服务，是校友之家网站系统中学校和校友之间进行信息交流的主要平台。系统的后台实现了对前台各个模块的管理功能，例如前台有信息平台模块，后台就有相应的信息平台管理模块。5.1校友之家网站系统前台设计校友之家网站系统的前台所要实现的功能有：校友注册、校友登陆、密码找回、用户中心、校友撷英、校园动态、信息平台、校友分会、留言板和校友论坛。其中用户中心要实现密码修改、个人信息修改和修改个人头像等功能。校友撷英要实现校友动态、校友风采、校友捐赠和校友感言等功能。信息平台要实现信息发布、信息查询和信息回复等功能。5.1.1校友之家网站前台功能模块校友之家网站前台校友注册用户中心校友撷英校园动态信息平台校友分会留言板校友论坛修改个人信息修改登陆密码修改个人头像查看站内短信校友动态校友风采校友感言校友捐赠校园动态学院简介校园风景发布信息回复信息查找信息浏览信息查看分会信息分会活动剪影发表留言查看留言回复发表帖子浏览帖子内容回复帖子图5-1 校友之家网站系统前台功能图5.1.2校友之家网站前台流程图如图5-2为校友之家网站前台流程图，从图中可以看出游客角色与盐城工学院校友角色之间的权限差别。游客浏览首页、浏览公告和使用校友注册功能。盐城工学院校友可以使用网站提供的所有功能。如图5-2为校友之家网站前台流程图。图5-2 校友之家网站系统前台流程图5.2校友之家网站系统后台设计校友之家网站系统的后台所要实现的主要功能有：a管理员管理：包括管理员的添加、修改和删除。b公告管理：包括公告的添加、修改和删除。c信息平台管理：包括信息管理、回复管理和信息类别管理。d新闻管理：包括新闻的添加、修改和删除。e论坛管理功能：包括论坛栏目设置、版主设置、类别管理、帖子管理等。f数据库管理功能：包括数据库备份、数据库还原和数据库备份文件管理。g站内通知管理：包括发送站内通知、修改站内通知和删除站内通知。h校友分会管理：包括分会的添加、分会信息修改、分会删除、分会活动剪影的添加、分会活动剪影的删除和分会活动剪影的修改。5.2.1校友之家网站后台功能模块校友之家网站后台管理员管理上传文件管理数据库备份还原数据库还原公告管理站内通知管理留言信息管理校友风采管理校友感言管理校友捐赠管理校友管理校友分会管理信息平台管理论坛管理新闻管理企业图片管理添加管理员删除管理员修改登陆密码普通管理员操作超级管理员操作信息管理回复管理公告修改公告删除公告添加帖子管理版主设置栏目管理分类管理图5-3 校友之家网站系统后台功能模块5.2.2校友之家网站后台流程图图5-4 校友之家网站系统后台流程图5.3校友之家网站系统的数据库设计5.3.1数据库结构设计根据校友之家网站系统的需求，通过对前台功能和后台各功能的内容和数据流程分析，设计如下所示的数据项和数据结构：a校友信息包括的数据项有：帐号、登录密码、姓名、性别、密码保护问题、密码保护答案、邮箱、公司信息、电话号码、入学年份、所在班级、工作地点、工作领域、QQ、注册时间、登录次数、上次登录时间等。b新闻信息包括的数据项有：新闻ID、新闻标题、新闻内容、新闻类别、新闻发布时间、新闻发布人、被点击次数等。c校友风采信息包括的数据项有：校友风采ID、校友ID、所属类别、标题、校友姓名、校友职位、所在单位、校友年届信息、文章内容、更新时间、被点击次数等。d校友分会信息包括的数据项有：分会ID、分会标题、分会名称、分会信息、更新时间等。e信息平台信息包括的数据项有：信息ID、信息标题、所属分类、信息内容、信息有效期、发布者ID、发布者姓名、发布时间、被浏览次数、回复次数等。f信息平台回复包括的数据项有：回复ID、信息ID、回复内容、回复人ID、回复人姓名、回复日期等。g站内信息 包括的数据项有：信息ID、信息标题、信息内容、发送时间、是否被阅读、校友ID、校友姓名。h留言信息包括的数据项有：留言ID、校友ID、校友姓名、留言内容、留言时间、IP信息、回复标识、回复时间、回复内容、信息是否保密等。i管理员信息包括的数据项有：管理员账号、管理员密码、上次登录时间、登录次数、IP信息、是否超级管理员等。j分会活动剪影包括的数据项有：剪影ID、剪影标题、发布时间、图片信息、分会ID。k论坛帖子及回复包括的数据项有：ID、标题、发布者ID、发布者姓名、发布时间、内容、所属版块、点击次数和回复次数等。得到上面的数据项和数据结构以后，就可以设计出能够满足用户需求的各种实体，以及它们之间的关系，为后面的逻辑结构设计打下基础，这些实体包括各种具体信息，通过相互之间的作用形成数据的流动。本系统根据上面的设计规划出的实体与E-R图有：校友信息实体、管理员信息实体、新闻信息实体、留言信息实体、新闻信息、校友分会信息E-R图、信息平台信息E-R图、校友风采信息实体。校 友帐号密码姓名性别班级工作单位密码提示问题密码提示答案入学时间电话邮箱图5-5 校友基本信息实体图ID标题内容点击次数发布人/单位类别时间新 闻图5-6 新闻基本信息实体图校友风采ID校友ID标 题类 别内 容时 间公司职务校友姓名点击次数图5-7 校友风采信息实体图校友分会分会名称分会ID分会信息分会标题建立时间分会活动剪影剪影ID分会ID剪影标题上传时间图片信息包 含1N图5-8 校友分会信息E-R图信息平台信息信息ID标 题类 别发布时间内 容发布人ID发布人姓名点击次数回复次数是否审核信息平台回复回复ID信息ID回复内容回复时间回复人姓名回复人ID包 含N1图5-9 信息平台信息E-R图留言信息留言ID留言内容校友ID校友姓名留言时间回复时间是否回复回复内容是否保密图5-10 留言信息实体图5.3.2数据库逻辑结构设计现在需要将上面的数据库概念结构转化为数据库系统所支持的实际数据模型也就是数据库的逻辑结构。在上面的实体以及实体之间关系的基础上，形成数据库中的表格以及各个表格之间的关系。校友之家网站系统数据库中校友基本信息表（表5-1）、新闻信息表（表5-2）、校友风采信息表（表5-3）、分会信息表（表5-4）、分会活动剪影信息表（表5-5）、信息平台信息表（表5-6）、信息平台回复信息表（表5-7）、留言信息表（表5-8）。表5-1 员工基本信息表（userinfo）列名数据类型长度允许空useridnvarchar16usernamenvarchar16password nvarchar16questionnvarchar50answernvarchar50emailnvarchar30Sexnvarchar2companynvarchar80phonenvarchar15regdatesmalldatetimeloginsint4loginipnvarchar25lastlogintimesmalldatetimeischecknvarchar2（续表5-1）classnvarchar30workarenvarchar50workonnvarchar50enterscnvarchar10Picnvarchar30Qqnvarchar20PostNumint4UserGroupnvarchar50uservipint4表5-2 新闻信息表（News）列名数据类型长度允许空idint4Titlenvarchar50ContentntextBigClassNamenvarchar50Usernvarchar50InfotimesmalldatetimeHitsint4表5-3 校友风采信息表（xyfc）列名数据类型长度允许空ArticleIDint4fc_Idnvarchar50BigClassNamenvarchar50Titlenvarchar100Specnvarchar50Xingmingnvarchar50Unitnvarchar50Memonvarchar50Hitsint4UpdateTimesmalldatetimeContentntextDefaultPicUrlnvarchar100表5-4 分会信息表（piantou）列名数据类型长度允许空articleidint4classnamenvarchar30（续表5-4）titlenvarchar60unitnvarchar40memonvarchar40updatetimedatetimecontentntextdefaultpicurlnvarchar100表5-5 分会活动剪影信息表（img）列名数据类型长度允许空idchar30titlenvarchar100imgnvarchar40timedatetimefhidnvarchar20表5-6 信息平台信息表（info）列名数据类型长度允许空infoidChar30titlenchar50useridchar16usernamenchar16contentntextinfodatedatetimeusefulintclassnamenchar30ischeckchar2Picchar50hitsint4wbint4表5-7 信息平台信息回复表（infowb）列名数据类型长度允许空wbidChar30UseridChar16Usernamenchar16Contentnchar600WbdateDatetimeinfoidChar30表5-8 留言信息表（message）列名数据类型长度允许空message_idint4users_namenvarchar16message_datechar40messagenvarchar800replynvarchar2huifu_datedatetimehuifu_textnvarchar800ipchar30useridchar16issecint5.4校友之家网站系统公共设计5.4.1数据库连接配置ASP技术可以使用ADO对象直接与数据库进行交互，很方便地与数据库建立连接，操作数据库。ADO是一种功能强大的数据库应用程序接口，通过ADO访问SQL Server数据库的编程接口如图5-11所示。应用程序ADOOLE DB Provider for ODBCOLE DB Provider for SQL ServerODBC Driver for SQL ServerSQL Server Database图5-11 通过ADO访问SQL Server 数据库的编程接口 在校友之家网站系统中使用的数据连接文件为conn.asp相关代码见附录1.1.1。5.4.2 校友之家网站导航校友之家网站的导航使用DIV+CSS设计，使用JavaScript语言加入了鼠标触发事件，具有很好的动态效果，效果如图5-12所示。图5-12 校友之家网站导航演示图导航中使用了CSS的UL标签这样就更容易控制导航中各个元素的显示样式。导航中的每个菜单都是UL中的一个子元素LI，这样的话只要编写LI的显示样式就可以控制所有导航栏中菜单的样式，对LI显示样式进行控制的代码如下：.banner limargin:0px; padding-left:2px; padding-right:15px; text-align:right;padding-bottom:0px; padding-top:0px; float:left; height:36px; list-style-type:none; line-height:36px;具体实现代码见附录1.1.2。 6校友之家网站系统的具体实现详细设计阶段的根本目标是确定应该怎样具体地实现所要求的系统，也就是说经过这个阶段的设计工作，应该得出对目标系统的精确描述，从而在编码阶段可以把这个描述直接翻译成某种程序设计语言书写的程序。因为篇幅原因在此只对前台的校友注册功能、信息平台功能、校友分会功能和后台的登陆功能、注册校友管理功能作详细介绍。6.1系统注册功能模块注册功能是校友们真正使用的第一个功能，所以注册功能做的好坏直接影响到整个校友之家网站在校友们心中的形象。在设计过程中我尽量让自己站在校友角度去思考问题，为了将注册功能做的更加人性化更加快捷高效，我参考了许多知名网站的注册页面的布局，并自学了Ajax技术。6.1.1用户存在性验证解决方法的比较与探讨通过在图书馆借书查阅资料和上网查找相关技术文档，然后经过自己的推敲和反复测试，我所总结出的解决网站注册中用户存在问题的方案主要有以下三种：a第一种方法，用户的存在性验证采用JavaScript进行客户端验证，必须在用户第一次打开注册页面就将所有已经注册的校友账号存于一个JavaScript数组里面，然后在用户填写完账号信息以后再在客户端进行比较。这种做法虽然可以实现实时的客户端用户存在性验证，但是所付出的代价是高昂的同时危险系数太高。b第二种方法是只在服务器端进行控制，这样一来用户只有在将注册信息提交以后才可能知道自己所填写的用户名是否可用，而当用户名不可用时用户必须重填写所有注册信息，这就必然会引起用户的不满最终导致网站用户的流失。挽救这个不足的方法是在用户提交注册信息的同时将用户的所有注册信息存入session值中，但是这样做同样代价高昂。c解决用户存在性问题的第三种方法是采用Ajax技术，同时也是当前来讲解决这个问题的最佳方法，用户在填写完账户信息之后立刻就可以得知自己所填写的账号在网站中是否已经被注册，而页面却没有被刷新。这就是Ajax中所提高的“异步”与“无刷”。关于Ajax技术在下面的章节中我将详细介绍。6.1.2功能简介图6-1为校友之家网站系统的注册页面，在页面的右部会很清楚的看到对所要填写信息的规则要求。在注册过程中用户必须将带红色星号的信息按规则要求填写完整，然后再点击注册按钮才能够进行注册，否则信息的提交将被终止系统将给出错误警告。用户通过表单提供注册信息，系统对用户提供的注册信息进行验证，如果合法，则将信息写入数据库，如果不合法则提示错误信息。图6-1系统注册页面系统注册页面使用了一个用户基本信息表(reg)。在系统注册页面里使用这个表单采集用户信息。表6-1 用户基本信息表名称表单元素类型Value值含义useridtext用户填写用户登录名usernametext用户填写用户姓名userpwdpassword用户填写用户登陆密码reuserpwdpassword用户填写确认登陆密码questionselect用户选择密码保护问题answertext用户填写密码保护答案sexselect用户选择用户性别classtext用户填写毕业班级companytext用户填写工作单位workareselect用户选择工作地区phonetext用户填写联系电话etimeselect用户选择入学年份workonselect用户选择工作领域qqtext用户填写用户QQsubmitsubmit注册提交表单6.1.3前台注册验证中JavaScript的使用在注册功能的前台验证中使用了JavaScript技术，这样做的好处在于用户不用真正提交注册信息就可以得知注册信息的合法性。不仅如此，在此功能的实现上我采用了更加灵活的显示方式。效果如图6-2所示。图6-2 系统注册验证页面如图所示用户所填写的注册信息合法性会实时地显示在页面的右部。在这里采用的是JavaScript和正则表达式相结合的方法，使用正则表达式可以更准确的验证数据，同时可以屏蔽非法字符。表单中JavaScript验证函数见附录1.1.3。6.1.4注册功能中Ajax的使用Ajax技术是当下流行的WEB技术，主要无刷的数据提交。Ajax使用XML传输数据、异步JavaScript解析XMLDocument对象、服务器回传数据不重绘页面，它可以与任何服务器技术进行交互。Ajax是典型的客户端技术，所以要使用Ajax还需要了解HTML、DOM、CSS和JavaScript，以及熟悉JavaScript的即时测试和JavaScript的浏览器版本测试。我在注册功能中使用Ajax技术实现了用户账号是否存在的无刷验证。Ajax验证的页面调用代码如下：Ajax的功能实现核心代码：/向服务器发送验证请求if(!objRequest&typeof XMLHttpRequest!=undefined) objRequest=new XMLHttpRequest();var url=check.asp?action=Isreg&name=+escape(name); if(objRequest!=null) objRequest.onreadystatechange = nameProcess; objRequest.open(get,url,true); objRequest.setRequestHeader(Content-Type, text/xml;charset=GB2312); objRequest.send(null); 功能演示如图6-3和图6-4所示。图6-3 系统注册页面Ajax使用1图6-4 系统注册页面Ajax使用2此验证功能的具体实现见附录1.1.4。6.1.5后台数据的验证和数据库写入所谓后台数据验证就是注册信息被提交给服务器后在写入数据库之前的最后一次验证。因为JavaScript 客户端解释语言，在客户端用户可以通过设置自己的浏览器属性来关闭浏览器对JavaScript的支持，这样一来前台验证写的再严谨也无用武之地，而此时使用服务器端脚本语言VBScript 编写的后台数据验证就显得尤其重要。如图6-5为注册成功页面。图6-5 系统注册成功页面6.2信息平台功能模块根据系统设计阶段的设计信息平台具有四个主要功能：发布信息、发表回复、查找信息、浏览信息。6.2.1发布信息功能的实现实现的主要功能为：进行信息验证，通过验证后方可写入数据库。图6-6为校友之家网站系统的发布信息页面。用户通过表单提供信息内容，系统对用户提供的信息进行验证，如果合法，则将信息写入数据库，如果不合法则提示错误信息。在这里值得提出的是对信息描述字数限制的控制，我所采用的不是简单的JavaScript验证，而是实时的字数显示和余下可数字数的提醒。这个功能的实现使用的仍然是JavaScript的客户端验证技术，但是在使用手法上却更加成熟和灵活。实现这个功能的前台层的布局和设置代码如下： 最多可输入，当前共，还可输入 图6-6 系统发布信息页面系统信息发布页面使用了一个信息表(infoadd)。在系统信息发布页面里使用这个表单采集信息。表6-2 信息表名称表单元素类型Value值含义titleText用户填写信息标题classnameSelect用户选择信息类别contentTextarea用户填写信息内容daysSelect用户选择信息有效期adIframe用户填写上传图片submitSubmit提 交提交表单在添加信息的表单中也加入了JavaScript的前台验证，在这里不再赘述。6.2.2信息查找功能的实现实现的主要功能为：根据查找依据合成SQL语句查找数据表。图6-7为校友之家网站系统的信息查找页面。用户通过表单提供信息查找依据，系统根据用户提供的查找依据合成SQL语句进行数据查找。系统信息查找页面使用了一个表单(infosearch)。在系统信息查找页面里使用这个表单采集查找依据信息。图6-7 系统信息查找页面表6-3 信息查找表名称表单元素类型Value值含义searchkeyText用户填写搜索关键字classnameSelect用户选择信息类别submitSubmit搜 索提交表单数据库搜索语句的组合代码见附录1.1.6。6.2.3发表回复功能的实现实现的主要功能有：数据通过客户端和服务器端验证后写入数据库。在发表回复页面中用户通过表单提供回复内容，系统对回复内容进行验证，发表的回复内容字符数不能超过300，校友在输入回复的过程中系统会自动提示已经输入的字符数与还可以输入的字符数。在此页面中使用的表单名为wb。表6-4 发表回复表名称表单元素类型Value值含义contentTextarea用户填写回复内容infoidHidden系统赋值信息IDsubmitSubmit发表留言提交表单图6-8为校友之家网站的发表回复页面：图6-8 系统发表回复页面在此功能上做了对留言的客户端验证包括字数限制等等，在服务器端做了同样的工作，是留言内容更加规整，更加合法。具体的实现方法和前几个功能类似，在此不再赘述。此功能模块尚存在的不足：没有对留言进行分页显示。此不足的存在原因是我在开发过程中的疏忽。我会尽快完善。6.3校友分会功能模块的实现校友分会的前台不需要浏览信息的校友填写任何信息，只需校友选择要浏览的分会点击进去进行浏览就可，这个模块中显然功能上要求不高，但要做的尽量人性化，方便校友进行浏览、查阅。在这里导航的现实样式就凸显出了它功能上的优越。在此功能模块上值得注意的是各个校友分会的活动剪影和各个分会的关联。要实现这个功能就需要在数据库中建立两张表：分会信息表、活动剪影表。而且分会信息表中的分会ID 应该作为外键存储在活动剪影表内。6.3.1校友分会导航的实现图6-9为校友之家网站校友分会的导航：图6-9 系统校友分会导航此处的导航功能是使用DIV+CSS设计，JavaScript语言实现的。具体实现代码见附录1.1.5。6.3.2人性化设计的体现网站功能的人性化程度是网站建设的一个软性指标，但是却直接影响到整个网站在校友心目中的形象。在校友之家网站功能的人性化问题上我与校友办的姚科长进行了多次探讨，在开发过程中姚科长的所提的意见让我能够更好地从校友们的角度去思考问题，去设计网站的功能。在校友之家网站各个功能的设计过程中我都尽量将人性化因素考虑在其中，因为经验和实力等因素我做的并不是很好。在设计中我认真考虑了校友在浏览校友分会信息的便捷性，将点击频率较高的功能键尽量放在页面中显眼且容易被点击到的地方，让校友在使用本系统时有种得心应手的感觉。当然我所做的还远远不足。 图6-10是校友分会信息的浏览页面。图6-10 系统校友分会浏览页面图6-11所示，页面顶部已经将所有分会信息罗列出来，如果校友想进行校友分会间的跳转浏览直接点击就可以，而不需要再去导航中找相应的分会链接。在分会活动剪影中的快捷体验如图6-11所示。图6-11 系统校友分会活动剪影页面 图6-11所示当鼠标放在页面中“分会活动”上时就会自动弹出各个分会活动剪影的链接。这样就更方便校友对分会活动剪影进行浏览。6.4后台管理登陆模块的实现网站的后台用于管理网站的所有资源，安全性要求相对较高，而后台的登陆模块是整个后台的门户，除了做到后台的安全隐藏以外还要做到后台登陆验证的尽可能严谨。校友之家网站的后台登陆页面如图6-12所示。图6-12 系统后台管理登陆页面后台登陆页面所包含的验证有：客户端JavaScript验证、服务器端验证、验证码验证。客户端JavaScript验证代码见附录1.1.7。运行结果如图6-13所示。图6-13 系统后台管理登陆判空验证如图6-14为系统后台登陆的报错页面图6-14 系统后台管理登陆后台验证报错如图6-15为系统后台登陆成功后的页面图6-15 系统后台管理登陆登陆成功页面6.5校友管理功能模块的实现普通管理员和超级管理员都可以对网站的注册校友进行管理。可以进行的操作有校友信息审核、校友锁定、校友删除、校友查询。其中信息审核功能能够很好地控制网站已经注册校友信息的真实性、有利于更好的维护校友之家网站秩序。图6-16是校友管理功能的初始页面。图6-16 系统校友管理页面如图6-16中所示，为通过信息验证的校友会在页面中直接显示出来，而且被用红色字样特殊标记出来。管理员只要点击操作一栏中的“审核”就可以对校友进行信息审核。此功能实现的代码如下：% if trim(rs(ischeck)=0 then response.write 否 else response.write 是 end if % 值得提出的是在此页面中还添加了发送站内通知的快捷方式，点击就可以直接对该校友发送站内通知。此功能实现的代码如下：a href=stamsgadd.asp?UserID=&Username= 发站内通知6.5.1注册校友信息审核的实现图6-17为校友信息的审核页面，如图所示，页面中将注册校友的所有信息都显示了出来，管理员根据所添加的信息来判断此条记录是否有效。若发现校友信息明显不属实可以直接将此记录删除。图6-17 系统校友信息审核页面删除快捷方式的实现代码为：a href=UserDel.asp?UserID=删除此用户信息若通过验证后属实，管理员只需在是否通过验证一栏中选择“予以通过”便可以通过该校友的注册。此处的页面逻辑控制代码为：option value=0 selected=selected未曾通过option value=1 selected=selected予以通过此功能的详细实现代码见附录1.1.10。7校友之家网站系统的测试与分析7.1系统测试方案及测试结果分析测试的目标或定义：a.测试是为了发现程序中的错误而执行程序的过程；b.好的测试方案是极可能发现迄今为止尚未发现的错误的测试方案；c.成功的测试是发现了至今为止尚未发现的错误的测