15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > 开发一个springboot+vue的项目【增加铃声制作的功能】

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

时间:2023-07-06 06:30:02 | 来源:网站运营

时间:2023-07-06 06:30:02 来源:网站运营

开发一个springboot+vue的项目【增加铃声制作的功能】:大家好呀,我是小孟!

参考的地址: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

三,核心代码展示

@RestControllerpublic 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) { String songId = request.getParameter("songId").trim(); //歌曲id String songListId = request.getParameter("songListId").trim(); //歌单id boolean flag = listSongService.deleteBySongIdAndSongListId(Integer.parseInt(songId), Integer.parseInt(songListId)); return flag; }​ 好了,springboot+vue的音乐项目整理结束,小伙伴们点赞、收藏、评论,一键三连走起呀,下期见~~

​​​​




最后,我将这个项目资料,都分享下:




关键词:功能,增加,项目

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭