爱音乐”网站的设计与制作毕业设计说明书
目录
一、引言 1
（一）发开背景 1
（二）选题意义 1
二、网站概述 1
（一）系统简介 1
（二）开发工具介绍 1
（三）开发环境 1
三、 网站总体设计 1
（一）前台模块设计 2
（一） 后台模块设计 3
（二） 数据库设计 3
1．数据库的需求分析 3
2．数据库逻辑表分析 3
四、网站主体设计 4
（一）网站LOGO设计 4
（二）页面布局 5
1．首页设计 5
2．商城和购物车页面 7
3．产品详情页面 8
4．榜单页面 11
5. 歌手页面 12
6．歌单页面 13
7．MV页面 14
8．个人中心页面 16
9．歌曲详情页面 18
（三）JavaScript特效运用 19
1．图片的轮播效果 19
2．图片切换大图、放大镜 20
3．数量的增加减少 21
五、后台管理设计模块 21
（一）登录注册模块 21
（二）购物车管理模块 23
总结 26
致谢 27
参考文献 28
一、引言
（一）发开背景
当今社会，音乐已经成为人们生活中不可或缺的一部分。古往今来，音乐总是以一种非凡魅力呈现在世人面前，是人类共有的精神食粮。随着时代的进步，互联网已经渗透人们生活的每一个角落，出现了各种类型和主题的网站，音乐网站是其中的一种。该类型的网站不仅收入丰富的歌曲，还提供了MV播放专题等。随着网站的推广，有越来越多的音乐网站出现，音乐网站的竞争也越来越大。在网络上听音乐的人越来越多。“爱音乐”网站就是以满足人们方便获取自己感兴趣的音乐以及购买到明星的周边产品而设计和制作的音乐主题网站。
（二）选题意义
虽然当前音乐网站众多，但是却很少能够满足音乐爱好者的个性化需求。通过本网站的开发帮助他们完成快速的音乐查找。“
*好棒文|www.hbsrm.com +Q: 3 5 1 9 1 6 0 7 2
不仅收入丰富的歌曲，还提供了MV播放专题等。随着网站的推广，有越来越多的音乐网站出现，音乐网站的竞争也越来越大。在网络上听音乐的人越来越多。“爱音乐”网站就是以满足人们方便获取自己感兴趣的音乐以及购买到明星的周边产品而设计和制作的音乐主题网站。
（二）选题意义
虽然当前音乐网站众多，但是却很少能够满足音乐爱好者的个性化需求。通过本网站的开发帮助他们完成快速的音乐查找。“爱音乐”网站是为了方便喜爱音乐的人们快速选择自己喜爱的音乐类型而设计和制作的，网站免费向广大用户提供方便流畅的在线音乐和丰富多彩的音乐风格。相对于其他风格的音乐网站，歌曲、歌单、歌手的分类比较详细，本课题在设计中还增加了一个听众之间分享心得感受的用户交流平台。
二、网站概述
（一）系统简介
为了让人们可以更快捷的选择自己感兴趣的音乐，制作了“爱音乐”音乐主题网站。该网站包括首页、榜单、歌手、歌单、MV、节目单、商城等栏目，用户可以直接选择自己想要的功能，操作十分方便。该网站还设置了用户的登录和退出，登录到系统的用户可以在商城中选择并购买自己喜欢的商品，也可以添加自己喜欢的歌单到个人中心。
（二）开发工具介绍
Photoshop CS3 是一款专门处理图片文字的软件，它拥有很强大的修图的功能，利用工具可以使图片更加美观漂亮。
Myeclipse 是在Eclipse的基础上添加特定插件构建而成的软件开发环境，主要用于Java及移动应用开发，该软件具有功能强大，支持广泛，兼容性好等特点。
Webstrom是一款可以编写Html，CSS，JavaScript和jQuery代码的一款软件。具有代码编写十分方便，整个屏幕非常简洁等特点，对于网站前端开发是一款非常好用的软件。
（三）开发环境
操作系统：Windows 7
数据库：MySQL
编写语言：Java
调试环境：Google浏览器、360浏览器、IE浏览器等
网站总体设计
（一）前台模块设计
网站前台包括访客和用户浏览网页信息，用户登录与退出和用户添加商品、歌曲等操作，网站前台栏目与功能如图3-1至图3-3所示。
图3-1 网站前台页面栏目与用户使用图
图3-2登录用户权限与访问操作图
图3-3以访客权限访问网站图
后台模块设计
网站后台是管理员管理整个网站的代码，操作流程如图3-4所示：
图3-4管理员权限流程图
数据库设计
网站采用MySQL作为数据库管理工具，它具有开放源代码，操作简单，安全性高，结构清晰等优点。以下是对系统中的数据库设计进行简要说明。
1．数据库的需求分析
根据本系统需求分析，数据库应当包含以下各表：
用户信息表：用户ID,用户名，密码
排行信息表：歌曲ID，歌曲名，排名，图片
管理员表：管理员ID，管理员名，密码
商品信息表：商品ID，商品名，价格，图片，歌手
2．数据库逻辑表分析
表3-1 用户信息表
字段名称
类型
宽度
可否未空
约束
含义
ID
varchar
50
否
主键
用户ID
sname
varchar
50
否
用户名
password
varchar
50
否
密码
表3-2 排行信息表
字段名称
类型
宽度
可否未空
约束
含义
ID
varchar
50
一、引言 1
（一）发开背景 1
（二）选题意义 1
二、网站概述 1
（一）系统简介 1
（二）开发工具介绍 1
（三）开发环境 1
三、 网站总体设计 1
（一）前台模块设计 2
（一） 后台模块设计 3
（二） 数据库设计 3
1．数据库的需求分析 3
2．数据库逻辑表分析 3
四、网站主体设计 4
（一）网站LOGO设计 4
（二）页面布局 5
1．首页设计 5
2．商城和购物车页面 7
3．产品详情页面 8
4．榜单页面 11
5. 歌手页面 12
6．歌单页面 13
7．MV页面 14
8．个人中心页面 16
9．歌曲详情页面 18
（三）JavaScript特效运用 19
1．图片的轮播效果 19
2．图片切换大图、放大镜 20
3．数量的增加减少 21
五、后台管理设计模块 21
（一）登录注册模块 21
（二）购物车管理模块 23
总结 26
致谢 27
参考文献 28
一、引言
（一）发开背景
当今社会，音乐已经成为人们生活中不可或缺的一部分。古往今来，音乐总是以一种非凡魅力呈现在世人面前，是人类共有的精神食粮。随着时代的进步，互联网已经渗透人们生活的每一个角落，出现了各种类型和主题的网站，音乐网站是其中的一种。该类型的网站不仅收入丰富的歌曲，还提供了MV播放专题等。随着网站的推广，有越来越多的音乐网站出现，音乐网站的竞争也越来越大。在网络上听音乐的人越来越多。“爱音乐”网站就是以满足人们方便获取自己感兴趣的音乐以及购买到明星的周边产品而设计和制作的音乐主题网站。
（二）选题意义
虽然当前音乐网站众多，但是却很少能够满足音乐爱好者的个性化需求。通过本网站的开发帮助他们完成快速的音乐查找。“
*好棒文|www.hbsrm.com +Q: 3 5 1 9 1 6 0 7 2
不仅收入丰富的歌曲，还提供了MV播放专题等。随着网站的推广，有越来越多的音乐网站出现，音乐网站的竞争也越来越大。在网络上听音乐的人越来越多。“爱音乐”网站就是以满足人们方便获取自己感兴趣的音乐以及购买到明星的周边产品而设计和制作的音乐主题网站。
（二）选题意义
虽然当前音乐网站众多，但是却很少能够满足音乐爱好者的个性化需求。通过本网站的开发帮助他们完成快速的音乐查找。“爱音乐”网站是为了方便喜爱音乐的人们快速选择自己喜爱的音乐类型而设计和制作的，网站免费向广大用户提供方便流畅的在线音乐和丰富多彩的音乐风格。相对于其他风格的音乐网站，歌曲、歌单、歌手的分类比较详细，本课题在设计中还增加了一个听众之间分享心得感受的用户交流平台。
二、网站概述
（一）系统简介
为了让人们可以更快捷的选择自己感兴趣的音乐，制作了“爱音乐”音乐主题网站。该网站包括首页、榜单、歌手、歌单、MV、节目单、商城等栏目，用户可以直接选择自己想要的功能，操作十分方便。该网站还设置了用户的登录和退出，登录到系统的用户可以在商城中选择并购买自己喜欢的商品，也可以添加自己喜欢的歌单到个人中心。
（二）开发工具介绍
Photoshop CS3 是一款专门处理图片文字的软件，它拥有很强大的修图的功能，利用工具可以使图片更加美观漂亮。
Myeclipse 是在Eclipse的基础上添加特定插件构建而成的软件开发环境，主要用于Java及移动应用开发，该软件具有功能强大，支持广泛，兼容性好等特点。
Webstrom是一款可以编写Html，CSS，JavaScript和jQuery代码的一款软件。具有代码编写十分方便，整个屏幕非常简洁等特点，对于网站前端开发是一款非常好用的软件。
（三）开发环境
操作系统：Windows 7
数据库：MySQL
编写语言：Java
调试环境：Google浏览器、360浏览器、IE浏览器等
网站总体设计
（一）前台模块设计
网站前台包括访客和用户浏览网页信息，用户登录与退出和用户添加商品、歌曲等操作，网站前台栏目与功能如图3-1至图3-3所示。
图3-1 网站前台页面栏目与用户使用图
图3-2登录用户权限与访问操作图
图3-3以访客权限访问网站图
后台模块设计
网站后台是管理员管理整个网站的代码，操作流程如图3-4所示：
图3-4管理员权限流程图
数据库设计
网站采用MySQL作为数据库管理工具，它具有开放源代码，操作简单，安全性高，结构清晰等优点。以下是对系统中的数据库设计进行简要说明。
1．数据库的需求分析
根据本系统需求分析，数据库应当包含以下各表：
用户信息表：用户ID,用户名，密码
排行信息表：歌曲ID，歌曲名，排名，图片
管理员表：管理员ID，管理员名，密码
商品信息表：商品ID，商品名，价格，图片，歌手
2．数据库逻辑表分析
表3-1 用户信息表
字段名称
类型
宽度
可否未空
约束
含义
ID
varchar
50
否
主键
用户ID
sname
varchar
50
否
用户名
password
varchar
50
否
密码
表3-2 排行信息表
字段名称
类型
宽度
可否未空
约束
含义
ID
varchar
50
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jsj/jsjkxyjs/2467.html
