高级网站开发技术实验报告d1.docx

1、高级网站开发技术实验报告d1高级网站开发技术上机实验报告实验名称： 计算机与通信工程学院学院网站设计_班 级 _网络1201班_ 学 号 _201258080111_ 姓 名 _赵凯鹏_实验日期 _2014.9.18_一、 网站需求说明1.需求说明（1）近年来，电信行业经历了很大的变化，包括从固定到移动、从语音到数据、从电路交换到分组交换、从窄带到宽带的变化。（2）电信运营商在市场和真唱歌的双重影响下，正面临着深刻的重组。（3）新技术、新业务创造了新的市场机会，使运营商不断兴起。（4）旧运营商为了保持原有的市场份额也通过兼并重组等方式不断扩大业务范围，争取为客户提供从传统的市话、长话、移动、智

2、能网到新型的数据。用户将来可以在多个运营商提供的多种电信业务中自由选择。2.功能需求模块分析设计（1）登陆模块实现登录功能的数据处理功能，如果用户名和密码不存在，实现注册功能。（2）用户管理模块开通账号、用户账号查询、用户列表。其中开通账号查询可以更方便用户的查询，用户可以通过开通账号查询来查取一些相关的信息。用户列表中具有增加、暂停、修改、和删除等功能。（3）管理员管理模块管理员管理模块分为三部分：增加管理员，管理员列表和私人信息。 增加管理员包括的信息有账号、登录密码、重复密码、真实姓名、管理员邮箱、联系电话、登录权限等。其中登录权限包括：管理员管理、资费管理、用户管理、账务查询、账单查询

3、。 管理员列表包括的信息：账号、姓名、电话、邮箱、开户日期、权限、修改和删除。 私人信息包括：登录密码、重复密码、真实姓名、管理员邮箱、开通日期、联系电话、登录权限，其中登录权限又包括资费管理、账务查询和管理员管理。 管理员管理模块的需求： 管理员开通管理：管理用户账号，包括账号开通、暂停（枷锁）、恢复、删除等。 管理员资料管理：管理员资料，包括姓名、身份证号、地址等。 管理员信息有：ID、姓名、账号、密码、状态（正常/暂停/关闭）、联系电话、Email、开通日期、停止日期、权限（查询/修改/开户/ALL）等。(4)资费管理模块完成资费的增、删、改、查功能。（5）账单管理模块需求：整合系统按月

4、生成用户账单。账单信息（可参考移动或联通的账单管理模块）：用户标识信息：账单ID、姓名、账号、状态、联系电话、开通日期、Email。账务信息：账号、日期、登录时间长度、本月费用。账单明细：登录时间、退出时间、时长。（6）账务管理模块需求：按月、年分别生成月账务信息统计报表和年账务信息统计报表。月账务信息(可参考移动或联通的账务模块)：生成一个计费月周期中每一天的账务信息。月账务信息：日期、时长、费用。年账务信息(可参考移动或联通的账务模块)：生成一个计费年周期中每一月的账务信息。年账务信息：月期、时长、费用。（7）用户自服务管理模块需求：用户通过Internet自查询自己的当前或历史账单，并能

5、修改自己的密码或变更相关业务。用户账务信息自查询：用户标识信息：账单ID、姓名、状态、开通日期。账务信息：日期、登录时长、本月费用。用户信息修改。账单明细：登录时间、退出时间、时长。二、网站结构说明项目结合html、css、JavaScript等技术来完成静态页面的设计，可以使用IDE或直接使用记事本编辑。经需求分析，本项目的总体功能模块架构设计如图2-1和2-2所示，该设计假设用户具备登陆权限。图2-1 带登陆权限的功能模块图图2-2 带注册功能的功能模块图三、网站页面开发1.登陆页面登陆模块根据用户名和密码以及权限进行数据的处理，如果用户密码不存在可以实现注册功能。登陆页面如图3-1所示。

6、图3-1 带权限设置和注册的登陆页面图3-1页面部分关键代码如下 输入用户姓名 输入用户密码 选择用户身份  普通用户   管理员    2.注册页面注册页面如图3-2图3-2 注册页面图3-2代码如下 密码: 确认密码： 爱好 3.项目主页面（1）单击图3-3的“确定”项目主界面如图3-3所示。另外有banner.html、about.html、top.html、topline.html使用框架组成主页面。图3-3 项目主界面图3-3代码如下 对不起，您的浏览器版本不支持，请更换新版本的浏览器. （2）Banner.html如图3-

7、4所示图3-4代码如下 用户管理 退出系统（3）About.html代码如下 Copyright  2010.清华大学出版社 （4）top.html代码如下（5）topline.html代码如下4.用户管理模块（1）listUser.html如图4-1所示图4-1代码如下 状态 开户日期 123 清华大学出版社 （2）listUser2.html如图4-2所示图4-2代码如下 总用户：3人，当前是：2-2 正常：1，暂停：1 删除：1 第2页/共3页上一页下一页转到 （3）open.html如图4-3所示图4-3代码如下 账务账号 * 请输入用户的账务账号名称（只允许用英文、数字、下划线，区分大小写）（4）usermes.html如图4-4所示图4-4代码如下 清华大学出版社 的资料管理状态 正常（5）addServices.html如图4-5所示图4-5代码如下 服务器密码 Openlab1 请输入要选择的服务器（6）servicesmes.html如图4-6所示图4-6代码如下     后退四、实验小结