开发一个springboot+vue的项目增加铃声制作的功能

Posted 2022-05-17 程序员springmeng

大家好呀，我是小孟！

参考的地址：https://github.com/Yin-Hongwei

前面小伙伴说要学习spring+vue的项目，我们录制了非常详细的教程，视频播放了突破了30w+，看来是真的香！

项目和教程都是开源的！

有小伙伴让小孟开发了，增加个人上传音乐和铃声制作的功能。

一，系统功能介绍

该版本加入了个人歌曲上传、根据歌曲制作铃声、铃声随机浏览、上传歌曲管理员复核。

该版本是用户是可以上传歌曲的，然后可以查看个人上传的歌曲，上传歌曲后，管理员进行审核。

1.1. 登陆后才可以上传歌曲

1.2. 已上传歌曲清单

登陆后，点击我的音乐->我的上传浏览已上传的歌曲清单，显示基本信息和审核状态和意见；

1.3. 上传歌曲

点击添加歌曲，录入歌名、歌手、简介、歌词及选择本地mp3歌曲，点击确定完成上传。

点击刷新，可看到已经上传成功。

1.4. 审核列表

登陆管理员后台，点击歌曲审核，可看到已有刚上传的歌曲十年，可变更图片，同时可审核通过和拒绝。

1.5. 审核通过

点击通过，弹出歌手选择界面，选择对应歌手，点击确定即可完成审核

1.6. 审核拒绝

点击拒绝，弹出拒绝理由填写界面，录入对应理由，点击确定，完成歌曲审核拒绝。

1.7. 上传人审核结果查看

审核通过的显示审核通过，审核拒绝的显示审核拒绝并展示审核意见。

1.8 制作铃声

针对正在播放的歌曲点击制作铃声，可进入铃声制作界面
注：登陆后才可以制作铃声，只有歌曲才可以制作铃声，

1.9 铃声制作

拖动左右时间定位戳，确定铃声长度，可点击播放按钮反复播放调整，点击生成铃声。

填写铃声名称，铃声简介，铃声展示图片，点击确定，即可完成铃声制作

1.10 铃声制作列表

我的音乐->我的铃声中可查看自己制作的铃声。

1.11 铃声浏览

点击铃声页面，即可左右浏览全网已制作的铃声，切换时会同步播放铃声

二，视频展示

当然，如果你想看在线的，也可以看：

https://www.bilibili.com/video/BV15541177pE?spm_id_from=333.999.0.0

三，核心代码展示

@RestController
public class AdminController 

    @Autowired
    private AdminService adminService;

    /**
     * 判断是否登录成功
     */
    @RequestMapping(value = "/admin/login/status",method = RequestMethod.POST)
    public Object loginStatus(HttpServletRequest request, HttpSession session)
        JSONObject jsonObject = new JSONObject();
        String name = request.getParameter("name");
        String password = request.getParameter("password");
        boolean flag = adminService.verifyPassword(name,password);
        if(flag)
            jsonObject.put(Consts.CODE,1);
            jsonObject.put(Consts.MSG,"登录成功");
            session.setAttribute(Consts.NAME,name);
            return jsonObject;
        
        jsonObject.put(Consts.CODE,0);
        jsonObject.put(Consts.MSG,"用户名或密码错误");
        return jsonObject;
    

/**
 * 收藏控制类
 */
@RestController
@RequestMapping("/collect")
public class CollectController 

    @Autowired
    private CollectService CollectService;

    @Autowired
    private SongService songService;

    /**
     * 添加收藏
     */
    @RequestMapping(value = "/add",method = RequestMethod.POST)
    public Object addCollect(HttpServletRequest request)
        JSONObject jsonObject = new JSONObject();
        String userId = request.getParameter("userId");           //用户id
        String type = request.getParameter("type");               //收藏类型（0歌曲1歌单）
        String songId = request.getParameter("songId");           //歌曲id
        if(songId==null||songId.equals(""))
            jsonObject.put(Consts.CODE,0);
            jsonObject.put(Consts.MSG,"收藏歌曲为空");
            return jsonObject;
        
        if(CollectService.existSongId(Integer.parseInt(userId),Integer.parseInt(songId)))
            boolean status = CollectService.deleteByUserIdSongId(Integer.parseInt(userId), Integer.parseInt(songId));
            if (status) 
                jsonObject.put(Consts.CODE,2);
                jsonObject.put(Consts.MSG,"取消收藏");
            
            return jsonObject;
        

        //保存到收藏的对象中
        Collect Collect = new Collect();
        Collect.setUserId(Integer.parseInt(userId));
        Collect.setType(new Byte(type));
        Collect.setSongId(Integer.parseInt(songId));

        boolean flag = CollectService.insert(Collect);
        if(flag)   //保存成功
            jsonObject.put(Consts.CODE,1);
            jsonObject.put(Consts.MSG,"收藏成功");
            return jsonObject;
        
        jsonObject.put(Consts.CODE,0);
        jsonObject.put(Consts.MSG,"收藏失败");
        return jsonObject;
    

    /**
     * 删除收藏
     */
    @RequestMapping(value = "/delete",method = RequestMethod.GET)
    public Object deleteCollect(HttpServletRequest request)
        String userId = request.getParameter("userId");           //用户id
        String songId = request.getParameter("songId");           //歌曲id
        boolean flag = CollectService.deleteByUserIdSongId(Integer.parseInt(userId),Integer.parseInt(songId));
        return flag;
    

    /**
     * 查询所有收藏
     */
    @RequestMapping(value = "/allCollect",method = RequestMethod.GET)
    public Object allCollect(HttpServletRequest request)
        return CollectService.allCollect();
    

    /**
     * 查询某个用户的收藏列表
     */
    @RequestMapping(value = "/collectOfUserId",method = RequestMethod.GET)
    public Object collectOfUserId(HttpServletRequest request)
        String userId = request.getParameter("userId");          //用户id
        return CollectService.collectOfUserId(Integer.parseInt(userId));
    

    /**
     * 获取歌曲的收藏量
     */
    @RequestMapping(value = "/getCollectCount",method = RequestMethod.GET)
    public Object getCollectCount(@RequestParam("userId") Integer userId) 
        List<Collect> collectList = CollectService.getCollectCount(userId);
        for (Collect collect : collectList) 
            List<Song> song = songService.getSongId(collect.getSongId());
            collect.setSongs(song);
        
        return collectList;
    

/**
 * 歌曲管理controller
 */
@RestController
@RequestMapping("/song")
public class SongController 

    @Autowired
    private SongService songService;

    /**
     * 添加歌曲
     */
    @RequestMapping(value = "/add",method = RequestMethod.POST)
    public Object addSong(HttpServletRequest request, @RequestParam("file")MultipartFile mpFile, @RequestParam("files")MultipartFile mvFile)
        JSONObject jsonObject = new JSONObject();
        //获取前端传来的参数
        String singerId = request.getParameter("singerId").trim();  //所属歌手id
        String name = request.getParameter("name").trim();          //歌名
        String introduction = request.getParameter("introduction").trim();          //简介
        String pic = "/img/songPic/tubiao.jpg";                     //默认图片
        String lyric = request.getParameter("lyric").trim();     //歌词
        //上传歌曲文件
        if(mpFile.isEmpty())
            jsonObject.put(Consts.CODE,0);
            jsonObject.put(Consts.MSG,"歌曲上传失败");
            return jsonObject;
        
        //文件名=当前时间到毫秒+原来的文件名
        String fileName = System.currentTimeMillis()+mpFile.getOriginalFilename();
        //文件路径
        String filePath = System.getProperty("user.dir")+System.getProperty("file.separator")+"song";
        //如果文件路径不存在，新增该路径
        File file1 = new File(filePath);
        if(!file1.exists())
            file1.mkdir();
        
        //实际的文件地址
        File dest = new File(filePath+System.getProperty("file.separator")+fileName);
        //存储到数据库里的相对文件地址
        String storeUrlPath = "/song/"+fileName;
        try 
            mpFile.transferTo(dest);
            Song song = new Song();
            song.setSingerId(Integer.parseInt(singerId));
            song.setName(name);
            song.setIntroduction(introduction);
            song.setPic(pic);
            song.setLyric(lyric);
            song.setUrl(storeUrlPath);
            if(!mvFile.isEmpty())
            	//文件名=当前时间到毫秒+原来的文件名
                String fileNames = System.currentTimeMillis()+mvFile.getOriginalFilename();
                //文件路径
                String filePaths = System.getProperty("user.dir")+System.getProperty("file.separator")+"mv";
                //如果文件路径不存在，新增该路径
                File file2 = new File(filePaths);
                if(!file2.exists())
                    file2.mkdir();
                
                //实际的文件地址
                File dests = new File(filePaths+System.getProperty("file.separator")+fileNames);
                mvFile.transferTo(dests);
                //存储到数据库里的相对文件地址
                String storeUrlPaths = "/mv/"+fileNames;
                song.setMvurl(storeUrlPaths);
            
            boolean flag = songService.insert(song);
            if(flag)
                jsonObject.put(Consts.CODE,1);
                jsonObject.put(Consts.MSG,"保存成功");
                jsonObject.put("avator",storeUrlPath);
                return jsonObject;
            
            jsonObject.put(Consts.CODE,0);
            jsonObject.put(Consts.MSG,"保存失败");
            return jsonObject;
         catch (IOException e) 
            jsonObject.put(Consts.CODE,0);
            jsonObject.put(Consts.MSG,"保存失败"+e.getMessage());
        finally 
            return jsonObject;
        
    

**
 * 歌单的歌曲管理controller
 */
@RestController
@RequestMapping("/listSong")
public class ListSongController 

    @Autowired
    private ListSongService listSongService;

    /**
     * 给歌单添加歌曲
     */
    @RequestMapping(value = "/add", method = RequestMethod.POST)
    public Object addListSong(HttpServletRequest request) 
        JSONObject jsonObject = new JSONObject();
        //获取前端传来的参数
        String songId = request.getParameter("songId").trim();  //歌曲id
        Integer songListId = Integer.valueOf(request.getParameter("songListId").trim()); //歌单id
        List<ListSong> listSongs = listSongService.selectBySongId(songId);

        for (ListSong listSong : listSongs) 
            Integer id = listSong.getId();
            ListSong songlist = listSongService.selectByPrimaryKey(id);
            if (songlist.getSongListId().equals(songListId)) 
                jsonObject.put(Consts.CODE, 0);
                jsonObject.put(Consts.MSG, "添加失败，原因是：歌曲重复");
                return jsonObject;
            
        
        ListSong listSong1 = new ListSong();
        listSong1.setSongId(Integer.parseInt(songId));
        listSong1.setSongListId(songListId);
        boolean flag = listSongService.insert(listSong1);
        if (flag) 
            jsonObject.put(Consts.CODE, 1);
            jsonObject.put(Consts.MSG, "保存成功");
            return jsonObject;
         else 
            jsonObject.put(Consts.CODE, 0);
            jsonObject.put(Consts.MSG, "保存失败");
        

        return jsonObject;

    

    /**
     * 根据歌单id查询歌曲
     */
    @RequestMapping(value = "/detail", method = RequestMethod.GET)
    public Object detail(HttpServletRequest request) 
        String songListId = request.getParameter("songListId");
        return listSongService.listSongOfSongListId(Integer.parseInt(songListId));
    

    /**
     * 删除歌单里的歌曲
     */
    @RequestMapping(value = "/delete", method = RequestMethod.GET)
    public Object delete(HttpServletRequest request) 以上是关于开发一个springboot+vue的项目增加铃声制作的功能的主要内容，如果未能解决你的问题，请参考以下文章
 
 Vue+SpringBoot超详细！一周开发一个SpringBoot + Vue+MybatisPlus+Shiro+JWT+Redis前后端分离个人博客项目！！！项目完结
 vue+spring boot从零开发BBS项目---前端篇（一）
 前后端分离的Web系统开发 Springboot Vue系列教程- Springboot项目的创建
 前后端分离SpringBoot+SpringCloudAlibaba+VUE一 || 项目架构简介
 微服务架构SpringBoot+SpringCloud+VUE二 || 项目架构简介
 SpringBoot+Vue前后端分离项目的搭建及简单开发（这次保证看明白~）