计算机毕业设计 | SpringBoot+vue移动端音乐网站 音乐播放器(附源码)

1,项目背景

随着计算机技术的发展,网络技术对我们生活和工作显得越来越重要,特别是现在信息高度发达的今天,人们对最新信息的需求和发布迫切的需要及时性。为了满足不同人们对网络需求,各种特色,各种主题的网站也在不断增加。

为了满足音乐爱好者,明星崇拜者,各种专辑痴迷着的需求,一批以音乐为主题的网站也应运而生。

由于以往的静态网页存在单调,维护任务大,缺乏和用户的交互,随着计算机软件知识的推广,动态网页正在走向普通的网页设计师的生活。

本站设计目标就是以SpringBoot和vue为基础框架设计一个以音乐播放动态交互网站,用户可以在浏览过程中,实现和本站信息的交互。

2,需求分析

2.1 系统需求

普通用户可以使用前台系统,当用户在系统中注册信息之后,使用账户密码登录之后可以使用前台系统的所以基本功能,如音乐播放,个人信息修改,音乐收藏,音乐评价,音乐收索等功能。

在这里插入图片描述

管理员用户可以通过账户登录之后进行后台管理界面,在后台系统当中管理员可以一览所有的基本数据如系统存在的歌曲数量,歌手数量,以及播放量等等,管理员用户可以对用户模块、歌手模块、歌单模块、评价模块以及分类模块进行增删改查操作。管理员用户还可以修改自身的账户密码。

在这里插入图片描述

2.2 功能需求

本系统分为前台系统和后台管理系统,前台系统包括:用户个人信息模块,歌曲模块,评论模块。后台管理系统包括:用户管理模块,歌手管理模块,歌单管理模块,评论管理模块,数据展示模块。

  1. 用户个人信息模块
功能名称功能描述
用户信息修改用户登录之后可修改自己注册时所填写的信息
登录用户通过注册好的账户信息进行登录
注册用户进入指定的界面进行信息填写,个人确认信息以及系统判定信息之后可注册成功。
  1. 歌曲模块
功能名称功能描述
歌曲播放用户点击歌曲,歌曲会自动播放,并且在下方会出现歌曲播放的进度条。
歌曲下载用户点击歌曲的下载按钮,歌曲会下载到用户的本地磁盘。
歌曲收藏用户登录之后,可以对喜欢的歌曲进行收藏,只需要点击收藏按钮即可。
  1. 评论模块
功能名称功能描述
歌单评价可以对歌单进行言论评价以及打分。
  1. 用户管理模块
功能名称功能描述
添加用户管理员登录之后可以对普通用户进行添加操作
修改用户管理员登录之后可以对普通用户的信息进行修改
查询用户管理员登录之后可以通过翻页进行查询用户,也可以通过关键字进行模糊查询。
删除用户管理员登录之后可以删除普通用户的账户。
  1. 歌手管理模块
功能名称功能描述
添加歌手管理员登录之后可以对歌手进行添加操作
修改歌手信息管理员登录之后可以对歌手的信息进行修改操作
查询歌手管理员登录之后可以进行翻页查找歌手,也可以进行关键字的模糊查询
删除歌手管理员登录之后可以删除选中的歌手信息
  1. 歌单管理模块
功能名称功能描述
添加歌单管理员登录之后可以对歌单进行添加操作
修改歌单管理员登录之后可以对歌单的信息进行修改
查询歌单管理员登录之后可以翻页查询歌单信息,也可以进行模糊查询
删除歌单管理员登录之后可以删除选中的歌单
  1. 评论管理模块
功能名称功能描述
评论查询管理员登录之后可以对用户的评论进行查看
评论删除管理员登录之后可以对用户的评论进行删除
  1. 数据展示模块
功能名称功能描述
数据展示管理员登录之后直接进入系统首页,在首页当中会展示歌手,歌曲,歌单等基本数据,还会对歌曲,歌单等数据的分布进行图形化分析以便于分析。

3,技术栈

本系统中技术使用,后端技术涉及到Spring Boot,Spring Security,MyBatis-Plus,MySQL,Redis等,前端技术涉及到Vue.js,Element-UI,ECharts,Axios等。

  • SpringBoot是当前流行的Java EE体系框架,Spring Boot提供了一种新的编程范式,能在小的阻力下开发Spring应用程序,可以更加敏捷地开发Spring应用程序,专注于应用程序的功能,不用在Spring的配置上多花功夫,甚至完全不用配置。Spring Boot遵循约定大于配置的理念,在父子工程理念上极大程度上解决了依赖冲突的问题。
  • Spring Security是Spring家族中的安全框架,Spring Boot对于Spring Security提供了自动化配置方案,可以零配置使用 Spring Security、Spring Security借助过滤器技术对Web应用进行保护,包括认证和授权两个过程。
  • Mybatis-Plus是一个Mybatis(opens new window)的增强工具,在Mybatis的基础上只做增强不做改变,为简化开发。
  • MySQL是目前世界上最流行的开源关系数据库,大多应用于互联网行业。
  • Redis是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库,并提供多种语言的API。
  • log4j是Apache下的一款开源的日志框架,能够满足我们在项目中对于日志记录的需求。
  • Vue 是一套用于构建用户界面的渐进式框架,与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用,Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。
  • Element-UI 是基于 Vue 实现的一套不依赖业务的 UI 组件库,提供了丰富的 PC 端组件,减少用户对常用组件的封装,降低了开发的难易程度。
  • ECharts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表。
  • Axios是一个基于promise的HTTP库,类似于jQuery的ajax,用于http请求。可以应用于浏览器端和node.js,既可以用于客户端,也可以用于node.js编写的服务端。📣 有源码 获取源码

4,系统设计

功能权限设计

在这里插入图片描述

5,音乐网站页面展示

5.1 登录/注册

登录
注册

5.2 首页

首页
首页全览

5.3 搜索歌曲

在这里插入图片描述

5.4 歌单

5.4.1 歌单详情

在这里插入图片描述

5.5 歌手

歌手页面
歌手详情页

5.6 播放页

歌曲播放页
歌曲播放列表

5.6.1 播放页功能

播放页功能从左到右,分别是:收藏歌曲、下载歌曲、播放列表、音量调节

在这里插入图片描述

在这里插入图片描述

5.7 我的

个人中心
编辑个人资料

5.8 现场

在这里插入图片描述

6,后台管理页面展示

6.1 登录

在这里插入图片描述

6.2 首页

在这里插入图片描述

6.3 用户管理

在这里插入图片描述

添加用户
修改用户

6.3.1 用户收藏管理

在这里插入图片描述

6.4 歌手管理

在这里插入图片描述

修改歌手
添加歌手

6.4.1 歌手歌曲管理

在这里插入图片描述

添加歌曲
修改歌曲

6.5 歌单管理

在这里插入图片描述

添加歌单
修改歌单

6.5.1 歌单歌曲管理

在这里插入图片描述
在这里插入图片描述

6.5.2 歌单评论管理

在这里插入图片描述


http://www.niftyadmin.cn/n/5311936.html

相关文章

计算机网络——实验七

使用socket实现一个基于C/S架构的通信程序 (1)客户端发送给服务器请求,发送表征身份的用户名和密码("admin","123456"); (2)服务器根据客户端发来的信息验证身份,如果验证…

[情商-9]:如何让聊天更情绪感和更有趣?

目录 前言: 1、只谈当下,不谈未来 2、避免以自我为的需求为中心,而是以对方的需求为中心 3. 留一点神秘感,说不能说得太透,使用模糊和多义词 4.并非一直说话的人就是会聊天, 5、摆脱巨婴思维&#xf…

深入了解pnpm:一种高效的包管理工具

✨专栏介绍 在当今数字化时代,Web应用程序已经成为了人们生活和工作中不可或缺的一部分。而要构建出令人印象深刻且功能强大的Web应用程序,就需要掌握一系列前端技术。前端技术涵盖了HTML、CSS和JavaScript等核心技术,以及各种框架、库和工具…

C#.Net学习笔记——设计模式六大原则

***************基础介绍*************** 1、单一职责原则 2、里氏替换原则 3、依赖倒置原则 4、接口隔离原则 5、迪米特法原则 6、开闭原则 一、单一职责原则 举例:类T负责两个不同的职责:职责P1,职责P2。当由于职责P1需求发生改变而需要修…

卡码网Java基础课 | 6. 数组的倒序与隔位输出

卡码网Java基础课|6. 数组的倒序与隔位输出 数组ArrayList增强for循环6. 数组的倒序与隔位输出 数组 Java中的数组是一种用于存储相同数据类型的元素的数据结构。 相同数据类型的元素指的是数组中的所有元素都必须是相同的数据类型;固定大小,连续存储&…

使用即时设计绘制原型设计方便吗?和Axure RP相比怎么样?

对于原型设计,APP 和 Web 都是一样的,因为产品原型是用来确定需求的工具。我们使用这种工具的目的是为了快速迭代,从而深入挖掘和筛选产品的需求。 绘制原型,最重要的原则是:快速、清晰! Axure 工具的优缺…

【AWS】使用亚马逊云服务器创建EC2实例

目录 前言为什么选择 Amazon EC2 云服务器搭建 Amazon EC2 云服务器注册亚马逊账号登录控制台服务器配置免费套餐预览使用 Amazon EC2 云服务器打开服务器管理界面设置服务器区域填写实例名称选择服务器系统镜像选择实例类型创建密钥对网络设置配置存储启动实例查看实例 总结 前…

Java19:TCP/UDP

1.程序架构 C/S:Client Server ​ 基于客户端服务器的程序架构,需要一个服务器或者N个客户端实现数据传输 B/S: Browser Server ​ 基于浏览器的程序架构,不需要客户端,只需要通过浏览器访问即可 2. TCP TCP : Transmission Contr…