《听 – 海的声音》
一.项目简介
该项目是一个类似于喜马拉雅听书项目的一个简化版,实现了能够在线听歌,用户能够上传歌曲,用户能够录制歌曲等相关的一些功能。
二.模块
该项目一共分为了两大模块,一类是游客模块,也就是前台模块。一类是创作者模块,称为后台管理模块。
两大模块的用例图如图所示。
三.数据库的设计
本设计的ER图如下:
一共建立了4张表:
1.用户表:
users:字段有 uid(primary key)、username、password
2.音频表:
track:tid(primary key)、title、uid、类型、二进制内容(歌曲以及录制内容)
3.专辑表:
albums:aid(primary key)、uid 、 专辑标题(title)、封面(cover)、状态(state)
4.音频于专辑关系表
relations: rid(primary key)、aid 、 tid
5.表与表的关系
用户-> 音频 :一对多关系 关系字段在多表(音频表有uid字段)
用户->专辑 :一对多关系
音频 <-> 专辑: 多对多关系
多对多需要借助中间表:relations表
6.约束关系
1.音频表的uid与用户表的uid建立外键约束
2.专辑表的uid与用户表的uid建立外键约束
3.关系表的aid与专辑表aid建立外键约束
4.关系表的tid与音频表的tid建立约束关系
create database MyListenBook charset utf8mb4;
use MyListenBook;
create table users(
uid int primary key auto_increment,
username varchar(20) not null unique,
password char(60) not null
);
create table tracks (
tid int primary key auto_increment,
uid int not null,
title varchar(10) not null,
type char(20) not null,
content longblob not null comment '音频的二进制数据') comment '曲目表';
create table albums (
aid int primary key auto_increment,
uid int not null,
title varchar(60) not null,
cover varchar(60) not null,
state int not null comment '0:已下线,1:未发布,2:已发布')comment'专辑表';
create table relations(
rid int primary key auto_increment,
aid int not null,
tid int not null)comment '维护专辑和音频之间的多对多关系';
-- 增加外键
alter table tracks add constraint FK_ID foreign key (uid) REFERENCES users(uid);
alter table albums add constraint FK_ID2 foreign key (uid) REFERENCES users(uid);
alter table relations add constraint FK_ID3 foreign key (aid) REFERENCES albums(aid);
alter table relations add constraint FK_ID4 foreign key (tid) REFERENCES tracks(tid);
7.功能对应sql语句
1.首页—查询所有专辑
select aid ,username,title, cover
from albums a join users u on a.uid = u.uid
where state = 2 order by aid desc;
2.专辑播放页
查询出专辑相关信息
select *
from albums a join users u on a.uid = u.uid
where aid = ?
查询出专辑对用的歌曲
sele tid
from realtions
where aid = ?
查询出歌曲相对应的相关信息
select *
from tracks
where tid in () order by ...
3.用户管理
注册
insert into users(username,password) values(?,?);
登录
select * from users where username = ?;
4.音频管理
录制和上传
insert into tracks(uid,,title,type,content) values (?,?,?,?)
音频列表
select * form tracks where uid = ? order by ...
分页
查询总数量
select count(*) from tracks where uid = ?
查询每一页的歌曲名
select tid, uid, title, type
from tracks
where uid = ? order by tid desc limit ? offset ?
关联数量
select tid, count(*)
from relations
where tid in () group by aid order by ...;
5.专辑管理
1.新建
insert into albums (uid,title,cover) values (?,?,?)
2.专辑列表
select * from albums where uid = ... order by...
3.分页
select count (*)
from albums where uid = ...
select * from albums
where uid = ... order by ...limit ...offset...
4.已绑定音频
select * from albums where aid = ...;
select * from relations where aid = ...;
select * form tracks where tid in () order by ...;
5.添加新音频
查询已绑定歌曲名
select tid form relations where aid = ?;
查询未绑定歌曲名单
select * from tracks
where uid = ...and tid not in(...) order by...
添加新关联,添加多条
insert into relations (aid,tid) values ((?,?) ,(?,?));
6.发布与下架
update albums set state = 2 where aid = ?
update albums set state = 0 where aid = ?
四.各个模块功能的以及数据流向的设计
该设计的软件层次图如下:
模块的功能
1.游客模块(publish)
主要功能有
所有专辑列表的展示
专辑列表中绑定的歌曲列表展示
播放专辑歌曲的展示
2.创作中心模块
1.用户管理模块
用户的注册功能
用户的登录功能
用户的注销功能
退出
2.音频管理模块
上传音频功能
录制音频功能
查看音频列表
3.专辑管理模块
新建专辑功能
专辑绑定歌曲功能
查看专辑列表
模块的数据流向
该设计的数据流图如下:
五.类的设计
将该项目的类分为如下结构:
2.service层
主要负责业务逻辑,类似多表进行数据拼接.
3.repository
主要负责数据库的查询等工作
4.dataObject
主要是一些数据的类,比如用户类,基本与数据库中的字段一致
5.util
主要负责数据库的连接操作以及打印日志的操作
6.viewObject
主要是负责提供前端数据的类。
六.前端模块的设计
前端主要是应用html和css样式的设计以及js对于DOM树的修改以及与后端进行数据交互的对ajax的请求。
七.项目成果演示
1.游客界面演示
首页可以看到所有人已经发布的专辑,并且有封面以及标题作者的展示,点击专辑的标题,进入到相关的专辑列表。
2.创作者模块
八.总结
项目源码git地址:https://gitee.com/wry15/mylistenbook
项目展示:http://43.142.146.34:8080/
1.为什么要做这个项目?
在如今这个快速发展的时代里,时常也需要静下心来慢慢体会这个这个世界。在每次睡不着的时候,总是会打开喜马拉雅听一段故事,能够更好的促进睡眠,使得第二天的工作变得高效。基于此,我应用自己所学的知识,开发一款基于web的网上听书的网页版,不仅能够提升自己的技术,而且还方便了自己。
2.本次项目的难点是什么?
我认为本次项目的难点首先在于环境的搭建,有一系列Tomcat环境的搭建以及content Path的配置等等,接着就是和之前的编码方式的不同,整个数据传输的过程比较繁琐,需要理清楚数据如何进行发送与接收。最后就是相关业务的流程,在需要理清楚业务流程的整个过程,以及业务对于sql的编写等工作。
3.本项目对你最大的提升是什么?
通过本次项目,最大的提升莫过于技术方面的提升,使得自己对于web编程更加清楚基本流程是什么,以及对于每一个数据他背后所存在的意义是什么,如何发送一个数据到前端,后端如何接收一个数据,如何处理一个业务,最重要的是在相关的业务中的逻辑需要一个个的捋清楚,每一步是怎样做的,这样做的目的是什么等等,有没有更好的方法。
4.一个数据发送的流程是什么?
这个范围有点大,我就拿登录页面来说,首先,从页面上获取到相关的用户名与密码,通过表单的方式进行提交。提交给相应的后端动态资源,动态资源获取到相关的用户名和密码后,该项目还可以加上密码相关的判断,通过数据库的查询工作进行对用户名和密码的匹配,如果匹配成功则通过重定向功能使进入到相关的用户中心首页中,若匹配失败则重定向到登录页面,这里也可以加上登录次数的限制。