基于springboot的在线音乐播放系统

爱被打了一巴掌 2024-04-03 08:07 83阅读 0赞

目录  
简 介 1  
D BMS及辅助软件 1  
创 建数据库 2  
添 加数据 3  
查 询 4  
普通查询 8  
更 新sql 20  
删 除sql 20  
删除记录 20  
视 图 22  
使 用数据库的应用系统设计报告 25  
意 向应用 25  
需 求分析 25  
3. 管理员能对网站的一切数据进行修改 25  
开 发环境 25  
功 能设计 26  
项目结构 27  
客户端 27  
Mapper 层 / DAO 层（dao、mapper 目录下） 29  
Service 层（service 目录下） 29  
Controller 层（controller 目录下） 29  
数 据库设计与实现 30  
E-R图 30  
数据字典设计（表设计） 30  
实体类 30  
联系类 38  
数据库交互设计 43  
使用mybatis后的数据库操作 44  
系 统部署 44  
前端 44  
系 统使用手册 46  
管理员端 46  
用户端 47

意 向应用  
在线音乐网站  
需 求分析  
根据自己使用经历，以及对QQ音乐，网易云音乐等考察。现总结出有一下的结论  
1.应将用户分为两种，一种是对网站进行维护的管理员，另一种是对网站进行日常使用的客户（消费 者）  
2.网站应有的数据有：歌手数据集，歌曲数据，歌单数据，用户对歌曲的操作数据，用户对歌单的操 作数据  
3.管理员能对网站的一切数据进行修改  
4.用户对歌曲的操作数据主要是收藏，点赞，播放，下载，评论。歌单则有评论、  
开 发环境  
系统架构：B/S  
开发语言：JAVA + JS  
IDE：IDEA IJ + VSCODE + DATAGRIP  
技术栈

名称 技术  
前端 VUE2.0 + Element UI  
后端 Spring Boot + MySql + mybatis

import {
         getSongOfSingerName, getCollectionOfUser } from '../api/index'
    import {
         mapGetters } from 'vuex'
    
    const mixin = {
        
      computed: {
        
        ...mapGetters([
          'userId',
          'loginIn'
        ])
      },
      methods: {
        
        // 提示信息
        notify(title, type) {
        
          this.$notify({
        
            title: title,
            type: type
          })
        },
        // 获取图片信息
        attachImageUrl(srcUrl) {
        
          return srcUrl ? this.$store.state.configure.HOST + srcUrl || '../assets/img/user.jpg' : ''
        },
        attachBirth(val) {
        
          let birth = String(val).match(/[0-9-]+(?=\s)/)
          return Array.isArray(birth) ? birth[0] : birth
        },
        // 得到名字后部分
        replaceFName(str) {
        
          let arr = str.split('-')
          return arr[1]
        },
        // 得到名字前部分
        replaceLName(str) {
        
          let arr = str.split('-')
          return arr[0]
        },
        // 播放
        toplay: function (id, url, pic, index, name, lyric) {
        
          this.$store.commit('setId', id)
          this.$store.commit('setListIndex', index)
          this.$store.commit('setUrl', this.$store.state.configure.HOST + url)
          this.$store.commit('setpicUrl', this.$store.state.configure.HOST + pic)
          this.$store.commit('setTitle', this.replaceFName(name))
          this.$store.commit('setArtist', this.replaceLName(name))
          this.$store.commit('setLyric', this.parseLyric(lyric))
          if (this.loginIn) {
        
            this.$store.commit('setIsActive', false)
            getCollectionOfUser(this.userId)
              .then(res => {
        
                for (let item of res) {
        
                  if (item.songId === id) {
        
                    this.$store.commit('setIsActive', true)
                    break
                  }
                }
              })
              .catch(err => {
        
                console.log(err)
              })
          }
        },
        // 解析歌词
        parseLyric(text) {
        
          let lines = text.split('\n')
          let pattern = /\[\d{
        2}:\d{
        2}.(\d{
        3}|\d{
        2})\]/g
          let result = []
    
          // 对于歌词格式不对的特殊处理
          if (!(/\[.+\]/.test(text))) {
        
            return [[0, text]]
          }
    
          while (!pattern.test(lines[0])) {
        
            lines = lines.slice(1)
          }
    
          lines[lines.length - 1].length === 0 && lines.pop()
          for (let item of lines) {
        
            let time = item.match(pattern) // 存前面的时间段
            let value = item.replace(pattern, '') // 存歌词
            for (let item1 of time) {
        
              let t = item1.slice(1, -1).split(':')
              if (value !== '') {
        
                result.push([parseInt(t[0], 10) * 60 + parseFloat(t[1]), value])
              }
            }
          }
          result.sort(function (a, b) {
        
            return a[0] - b[0]
          })
          return result
        },
        // 搜索音乐
        getSong() {
        
          if (!this.$route.query.keywords) {
        
            this.$store.commit('setListOfSongs', [])
            return
          }
          getSongOfSingerName(this.$route.query.keywords)
            .then(res => {
        
              if (!res.length) {
        
                this.$store.commit('setListOfSongs', [])
                this.notify('系统暂无该歌曲', 'warning')
              } else {
        
                this.$store.commit('setListOfSongs', res)
              }
            })
            .catch(err => {
        
              console.log(err)
            })
        }
      }
    }
    
    export default mixin

![在这里插入图片描述][3c34fda8a03445be992c5ef7f6ed4c4f.png_pic_center]  
![在这里插入图片描述][b12d746de11e4029b71a1676d97aaf68.png_pic_center]  
![在这里插入图片描述][a0d7ae7d506e44da91dc407e9d7df950.png_pic_center]  
![在这里插入图片描述][77cf6643073949f7aad8e7fb0e668c1e.png_pic_center]  
![在这里插入图片描述][f5fb7d33e9a249998071a3a093a6c347.png_pic_center]  
![在这里插入图片描述][92fe703ba01f46c2ba53c5352927e6f6.png_pic_center]  
![在这里插入图片描述][59a474ada8984ea9b64c2ec67c5b9aa7.png_pic_center]  
![在这里插入图片描述][02d95fcf8c1f493fbdd4a7aae0be4628.png_pic_center]  
![在这里插入图片描述][c8a3cdb60a2d4ce4829a33952bce2ce0.png_pic_center]  
![在这里插入图片描述][17e820bf21d346a0acaaa7e33ee30f49.png_pic_center]  
![在这里插入图片描述][b26a2ff64035435fb886c7b7cc7d76c0.png_pic_center]  
![在这里插入图片描述][6ba81e28302641708fc1bd9b501c5e6b.png_pic_center]  
![在这里插入图片描述][48da3b5d958641798e71aae516741749.png_pic_center]  
![在这里插入图片描述][95253ce7fccd494f8a5d277fd686e54f.png_pic_center]  
![在这里插入图片描述][3707438c446245419a54a8d6e3c3a771.png_pic_center]  
![在这里插入图片描述][78c79a30805b4300b90b83164bc5a227.png_pic_center]  
![在这里插入图片描述][c1530a8442e74482b7c9fb3fe0846c36.png_pic_center]  
![在这里插入图片描述][07372b2dd5b34ba6b11a3bc2c4040230.png_pic_center]  
![在这里插入图片描述][634849ef69284b5f95ef2e057e0fb786.png_pic_center]  
![在这里插入图片描述][2b005b02ac5c4d429cc0340fb7b61ab5.jpeg_pic_center]  
![在这里插入图片描述][6a2fb2b45f104e27adb59ac4522bd901.png_pic_center]  
![在这里插入图片描述][bec1df53b7c5456aa57f9e8ca69bcb0e.jpeg_pic_center]  
![在这里插入图片描述][435297dff62645b7bdd543027f24e023.png_pic_center]  
![在这里插入图片描述][b0605be64db34c2e849ff1cfac969a8b.jpeg_pic_center]

[3c34fda8a03445be992c5ef7f6ed4c4f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/dd0ddc2f8b534b2c88419fd139748595.png
[b12d746de11e4029b71a1676d97aaf68.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/96db94a5b28f4511aaad384a7d032fb5.png
[a0d7ae7d506e44da91dc407e9d7df950.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/0d2b4cbc6e4a48168b59e71471a4c38b.png
[77cf6643073949f7aad8e7fb0e668c1e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/d693b096e820442aa94e0c56255725af.png
[f5fb7d33e9a249998071a3a093a6c347.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/a39f6318f5954a94b9024ae6b2e9a90d.png
[92fe703ba01f46c2ba53c5352927e6f6.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/bb50d71479314969ab563f7e01d277fc.png
[59a474ada8984ea9b64c2ec67c5b9aa7.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/da596a26f1ce4a4b9a43da7d7b7956d9.png
[02d95fcf8c1f493fbdd4a7aae0be4628.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/35a89f0b6ff840c49fa9416802d829d7.png
[c8a3cdb60a2d4ce4829a33952bce2ce0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/92b35ef8492949deb4158ab7a9b128d5.png
[17e820bf21d346a0acaaa7e33ee30f49.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/76f745923f1c4a9488a559d47adc9b48.png
[b26a2ff64035435fb886c7b7cc7d76c0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/b850c278c9c04530be34759ba9054e38.png
[6ba81e28302641708fc1bd9b501c5e6b.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/5a44274c9a904869b5f700710a5b9dc5.png
[48da3b5d958641798e71aae516741749.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/3a6d1315006248abb84b04bbbea4f728.png
[95253ce7fccd494f8a5d277fd686e54f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/8db469860aa048549421dc1a87c3d49f.png
[3707438c446245419a54a8d6e3c3a771.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/3eea19ea00b6447caf3c114f06742452.png
[78c79a30805b4300b90b83164bc5a227.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/4635a4253f794aee9ba8489b76a87d44.png
[c1530a8442e74482b7c9fb3fe0846c36.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/8ce412031c614e7784b9b3df1894fc2b.png
[07372b2dd5b34ba6b11a3bc2c4040230.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/111caa4b05514a6695a59ccf68314d83.png
[634849ef69284b5f95ef2e057e0fb786.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/a08b2871b78e4cdba7881ebe4a70bd42.png
[2b005b02ac5c4d429cc0340fb7b61ab5.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/55186d932610466984e58ae90a99c92d.jpeg
[6a2fb2b45f104e27adb59ac4522bd901.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/c47ba2bd392b4443927a15a95c95c508.png
[bec1df53b7c5456aa57f9e8ca69bcb0e.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/7f05f2ab31304153a22bf9d3f5c4b866.jpeg
[435297dff62645b7bdd543027f24e023.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/16db07217c6f4062bdfdc1610c68eea9.png
[b0605be64db34c2e849ff1cfac969a8b.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/35bb21596f3846e2aa75adca09b6ed66.jpeg