第1节课程设计题目及背景 (3)1.1 设计题目 (3)1.2 设计背景 (3)第2节网站设计的开发工具 (3)第3节网站建设过程 (4)3.1 网站系统分析 (4)3.2 数据库的设计 (5)3.3 功能模块介绍 (8)第4节网站工作流程 (11)4.1 连接数据库 (11)4.2 用户登录 (12)4.3 歌曲显示,以最新歌曲为例 (12)4.4 音乐搜索 (12)第5节网站显示效果 (15)5.1 网站主页 (15)5.2 歌曲分类页面 (16)5.3 音乐搜索页面 (17)5.4 用户留言页面 (17)5.5 音乐播放器页面 (18)5.6 后台管理主页面 (19)5.7 用户管理页面 (19)第6节总结和设计体会 (21)第1节课程设计题目及背景1.1 设计题目构架一个音乐网站,要求网站必须包含音乐网站的一些基本功能,即前台的用户申请登陆功能,听歌功能,音乐搜索,音乐收藏功能,提交留言和后台的用户管理,歌曲管理,留言管理,系统管理。
1.2 设计背景在互联网发展迅猛的今天,我们无时无刻不与网络接触,可以从中查找我们需要的信息,可以发布想让别人知道的信息,可以找到你不认识但真心的朋友,也可以第一时间看到国内外的重大事件。
当我们无事可做的时候,便开始了娱乐方式的搜索,由此,很多音乐网站和视频网站应运而生,服务大家,为我们的生活增添了色彩。
随着我国网民的增加,也促进了音乐网站的开发。
第2节网站设计的开发工具2.1 Dreamweaver 8.02.2 Flash 8.02.3 Firework 8.02.4 Access数据库2.5 IIS服务器说明:Dreamweaver用于网站的开发,Flash用于网站flash效果的制作,firework对图片进行处理,IIS作为我们的asp网站服务器,数据库则采用微软的Access数据库。
第3节网站建设过程3.1 网站系统分析音乐网站包括两大功能模块:前台和后台。
两大功能模块又分为很多子模块。
前台包括动态显示歌曲模块,动态显示时间模块,用户登录与注册模块,关于我们和留言模块,音乐搜索模块。
后台包括用户管理模块,歌曲管理模块,留言管理模块和系统管理模块。
整体模块组织如下图所示:3.1.1 前台模块详细功能描述用户注册:用户注册自己的空间用户登录:用户登录空间查看音乐收藏动态显示歌曲:根据类别不同,显示华人歌曲,日韩歌曲,影视歌曲,伤感歌曲,非主流歌曲等等。
动态时间:网页中显示动态的时间音乐搜索:搜索数据库中包含的歌曲留言:用户提交自己的留言3.1.2 后台模块详细功能描述用户管理:显示和编辑所有用户信息,歌曲收藏和删除用户歌曲管理:显示,编辑和插入歌曲信息,删除歌曲留言管理:显示和删除留言信息系统管理:修改管理员密码和网站信息3.2 数据库的设计3.2.1 用户信息表(users),属性和内容如下表:列名数据类型必填字段默认值说明Userid 自动编号是无用户Id Username 文本是无用户名Userpassword 文本是无密码Mobile 文本是无手机Userqq 文本是无QQAdddate 日期/时间是是注册日期Psw_quesions 文本是无密码提示Psw_answer 文本是无密码答案City 文本是无所在城市Address 文本是无地址Sex 文本是无性别Realname 文本是无真实姓名Code 文本否无邮编Useremail 文本是无电子邮箱3.2.2 音乐信息表(music),属性和内容如下表:列名数据类型必填字段默认值说明id 自动编号是无音乐编号Music_name 文本是无音乐名称Artist 文本是无艺术家url 文本是是音乐文件地址Zhuanji 文本是无所属专辑Adddate 日期/时间是是添加日期Liebie 文本是是所属分类3.2.3 管理员信息表(admin),属性和内容如下表:列名数据类型必填字段默认值说明Id 自动编号是否管理员编号Admin 文本是否用户名Adminpassword 文本是否密码3.2.4 留言信息表(liuyan),属性和内容如下表:列名数据类型必填字段默认值说明Ly_id 自动编号是否留言编号Content 文本是否留言内容Connection 文本是否留言方式Addtime 日期/时间是是留言日期3.2.5 网站信息表(webmess),属性和内容如下表:列名数据类型必填字段默认值说明Shuoming 文本是否网站说明Web_name 文本是否网站名称Web_yuming 文本是否网站域名Web_key 文本是否关键字Describle 文本是否描述3.2.6 歌曲收藏表(shoucang),属性如下表:列名数据类型必填字段默认值说明S_id 自动编号是否收藏编号Username 文本是否用户id Music_name 文本是否音乐id Adddate 日期/时间是否收藏时间3.2.7 用户-音乐关系表(sx),属性如下表:列名数据类型必填字段默认值说明S_id 自动编号是否编号Username 文本是否用户名Music_name 文本是否歌曲名Artist 文本是否艺术家url 文本是是音乐地址Adddate 日期/时间是是添加日期3.3 功能模块介绍3.3.1 登陆注册模块该模块的工作流程图如下:3.3.3 动态显示时间模块该模块采用javascript脚本显示动态的系统时间,代码如下:<script language = "javascript" > //动态时钟<!--function show(){var date = new Date(); //日期对象var now = "";var myweekday=date.getDay();var weekday="";now = date.getFullYear()+"年";now = now + (date.getMonth()+1)+"月";now = now + date.getDate()+"日 ";if(myweekday== 0)weekday=" 星期日 ";else if(myweekday == 1)weekday=" 星期一 ";else if(myweekday == 2)weekday=" 星期二 ";else if(myweekday == 3)weekday=" 星期三 ";else if(myweekday == 4)weekday=" 星期四 ";else if(myweekday == 5)weekday=" 星期五 ";else if(myweekday == 6)weekday=" 星期六 ";now = now +weekday;now = now + date.getHours()+":";if(date.getMinutes().toString().length==2)now = now + date.getMinutes()+":";elsenow = now + "0"+date.getMinutes()+":";if(date.getSeconds().toString().length==2)now = now + date.getSeconds();elsenow = now + "0"+date.getSeconds();document.getElementById("nowDiv").innerHTML = now; //div的html是now这个字符串setTimeout("show()",1000); //设置过1000毫秒就是1秒,调用show方法}--></script>3.3.4 音乐搜索模块该模块的工作流程图如下:3.3.5 留言模块该模块的工作流程图如下:3.3.6 后台管理该模块的工作流程图如下:第4节网站工作流程4.1 连接数据库4.1.1 创建ODBC数据源管理工具—数据源ODBC—系统DSN打开ODBC Microsoft Access安装,数据源名conn,选择数据库文件,确定。
4.1.2 连接数据库文件(如下图)4.2 用户登录包括3个页面:login.asp,loginfo.asp和loginerr.asp,通过添加服务器行为的登陆用户行为即可。
登陆成功如图:4.3 歌曲显示,以最新歌曲为例4.3.1 做出最新歌曲显示页面,如下:4.3.2 绑定记录集添加服务器行为中的添加记录集,打开下图记录集节目,正确填写各项,华人歌曲和日韩歌曲等页面只是筛选或排序不同而已。
此页面的记录集如下:4.3.3 添加重复区域和显示区域选中要重复的区域,添加服务器行为中的重复区域,选择相应条件即可,选择插入—应用程序—记录集分页—记录集导航条,添加上一页和下一页等。
4.3.4 显示的结果如下:4.4 音乐搜索4.4.1 添加搜索结果页面4.4.2 绑定记录集注:Request.Form(“searchtext”)是从搜索页面传递过来的参数,并将该参数与数据库中的歌曲名和艺术家字段比较,筛选出需要的记录。
4.4.3 搜索结果显示,如下:4.5 音乐播放页面4.5.1 Dreamweaver中制作出该页面注:列表中为框架网页,包括15个网页,即15个分类,可以查看自己的收藏,并播放收听美妙的歌曲。
4.5.2 绑定记录集注:musicid为点击试听后传递的参数第5节网站显示效果5.1 网站主页注:主页的右上角为动态时钟,上方为网站形象flash,并有设为首页和添加收藏功能,可通过上传作品和下载作品查看说明,中间网站分类导航条和音乐搜索,左下角为会员登录窗体,可通过链接进行注册,下方网站版权说明,关于我们和留言提交链接。
5.2 歌曲分类页面注:歌曲分类页面均来自于模板,结构相似,只是数据集的绑定不同而已,故此不做重复介绍。
5.3 音乐搜索页面注:在音乐搜索文本框中输入搜索文本,点击音乐搜索按钮后,会显示出搜索结果,同样也可以在有主页模板生成的其他页面进行搜索。
5.4 用户留言页面输入反馈内容和联系方式后,单击确定提交按钮,即可将用户要反馈的内容提交给后台数据库。
5.5 音乐播放器页面注:点击音乐名称链接或者点击试听后,网站会自动打开该网页播放器页面,播放你选中的音乐,而播放器的左边分类歌曲列表,供你选择喜欢的各种类型歌曲。