我的第一个项目OnlineMusic设计文档

项目简介

• OnlineMusic是基于 BS 架构实现的 web 项目, 用户只要有网络的就可以听到自己喜欢听的音乐, 看到自己喜欢看的MV, 主要实现功能如下:

1. 登录、注册、注销
2. 上传音乐、视频
3. 删除某一个音乐或视频信息
4. 删除选中的音乐或视频信息
5. 查询音乐或视频(包含查找指定/模糊匹配查询)
6. 添加音乐或视频到“喜欢列表”。
7. 查询喜欢的音乐或视频(包含查找指定/模糊匹配查询)

开发环境和技术栈

• Java、MySQL、Maven、Tomcat、HttpServlet、Json、HTML、CSS、JS

整体框架

• 项目整体基于HTTP协议，前端使用HTML+CSS+JS构建页面整体布局，后端采用分层结构，分为Servlet层，Dao层、MySQL层的设计，以达到在设计上的高内聚低耦合。

项目演示

OnlineMusic链接

• 主页
  

• 登录
  

• 首页
  

• 喜欢页面
  

• mv播放
  

数据库设计

create table user (
id int primary key auto_increment,
name varchar(200) unique,
password varchar(200) not null
); -- 用户表

create table music (
id int primary key auto_increment,
title varchar(200) not null,
singer varchar(200) not null,
time varchar(20) not null,
url varchar(200) not null
); -- 音乐表

create table loveMusic (
id int primary key auto_increment,
userId int not null,
musicId int not null,
foreign key (userId) references user(id),
foreign key (musicId) references music(id)
); -- 私人喜欢列表

create table mv (
id int primary key auto_increment,
message varchar(200) not null,
url varchar(200) not null
); -- mv表

create table loveMv (
id int primary key auto_increment,
userId int not null,
mvId int not null,
foreign key (userId) references user(id),
foreign key (mvId) references mv(id)
); -- 私人喜欢列表

前后端接口设计

• 登录

请求： 
POST /loginServlet 
data：{
    
    username,password} 
响应： 
{
    
    msg: true}

• 注册

请求：
POST /registerServlet
data：{
    
    username,password}
响应：
{
    
    msg: true}

• 上传音乐

请求1：上传音乐到服务器目录 
POST /upload 
请求2：将音乐信息同步插入到数据库当中 
POST /uploadsucess

• 删除某一个音乐信息

请求： 
POST /deleteServlet 
data: {
    
    "id": id} 
响应： 
{
    
    msg: true}

• 删除选中的音乐信息

请求： 
POST /deleteSelMusicServlet 
data:{
    
    "id":id}//id为数组 
响应： 
{
    
    msg: true}

• 查询所有音乐

请求：
GET /findAllMusicServlet

• 查询音乐(包含查找指定/模糊匹配的音乐)

请求： 
POST /findLoveMusic 
data:{
    
    musicName:musicName}

• 添加音乐到“喜欢列表”

请求： 
POST /loveMusicServlet 
data: {
    
    "id": obj} 
响应： 
{
    
    msg: true}

• 移除喜欢的某个音乐

请求： 
POST /removeLoveServlet 
data: {
    
    "id": obj}

• 显示我喜欢的音乐

请求：
GET /findAllLoveMusicServlet 

• mv相关接口设计类似music的
• 退出登录

请求：
GET /outServlet

• 账号注销

请求：
GET /cancellationServlet 

项目OnlineMusic源码