【开发一个简单的音乐播放器+服务端】【一】

忘是亡心i 2022-05-17 20:11 182阅读 0赞

实现效果：服务端上传音乐文件并保存音乐信息到数据库，移动端音乐播放器查看所有上传的音乐文件并选择播放

实现一个播放器的基本功能(上一首，播放，暂停，下一首)

首先先来建立个存放音乐的数据库mymusic

建立一张music表来存放音乐，数据表有三个字段

mid:音乐id

musicname:音乐名称

author:创作者

接着就是服务端了，服务端是用SpringMVC+MyBatis写的，很简单的一个服务器，其实什么框架不是重点，重点是实现功能。。。

在配置好Spring和MyBatis的各种配置后，先来写一个控制器用于上传文件

这里我就直接贴代码了：

@Controller
    public class UploadServlet {
    	MusicService musicService = new MusicImpl();
    	@RequestMapping(value="/showupload",method={RequestMethod.GET,RequestMethod.POST})
    	public String showUpload()
    	{
    		return "upload";
    	}
    	
    	@RequestMapping("/upload")
    	public String Upload(@RequestParam("file")CommonsMultipartFile file,String author,
    			HttpServletRequest request,Model model)
    	{
    		String Syspath = request.getServletContext().getRealPath("/upload");
    		File path = new File(Syspath); 
    		if(!path.exists())
    		{
    			path.mkdirs();
    		}
    		String fileName = file.getOriginalFilename();
    		try {
    			InputStream is = file.getInputStream();
    			String destfile = Syspath+"/"+fileName;
    			Files.copy(is, Paths.get(destfile));
    			
    			//数据库插入数据
    			musicService.AddMusic(fileName, author);
    			
    			model.addAttribute("rs","上传成功,上传路径:"+destfile+"||数据库添加成功");
    		} catch (Exception e) {
    			// TODO Auto-generated catch block
    			e.printStackTrace();
    		}
    		return "result";
    	}
    }

这里面的MusicService musicService = new MusicImpl();是一个业务类的实现接口，用于上传文件成功后添加音乐信息到数据库

/showupload请求映射用于显示上传文件的界面，新建一个jsp文件显示视图

/upload请求映射用来接收上传的文件

接收到文件后获取项目部署路径与文件名拼接为文件真实路径保存

下面是jsp文件代码:

比较简单，一个type为file的input用于选择提交的音乐文件，一个type为text的input用于提交创作者姓名

<%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    <form action="upload" method="post" enctype="multipart/form-data">
    <input type="file" name="file" />
    <input type="text" name="author" />
    <input type="submit" />
    </form>
    </body>
    </html>

上传文件部分完成了，下面再来写一个接口用来提供已经上传的所有音乐信息

Music实体类:

public class Music {
    	int mid;
    	String musicname;
    	String author;
    	public int getMid() {
    		return mid;
    	}
    	public void setMid(int mid) {
    		this.mid = mid;
    	}
    	public String getMusicname() {
    		return musicname;
    	}
    	public void setMusicname(String musicname) {
    		this.musicname = musicname;
    	}
    	public String getAuthor() {
    		return author;
    	}
    	public void setAuthor(String author) {
    		this.author = author;
    	}
    }

获取所有音乐信息接口:

@Controller
    public class MusicServlet {
    	MusicService musicService = new MusicImpl();
    	@RequestMapping(value="/getmusic",produces = "text/html;charset=UTF-8")
    	@ResponseBody
    	public String getmusic(Model model)
    	{
    		List<Music> musics = musicService.GetAll();
    		Gson gson = new Gson();
    		String rs = gson.toJson(musics);
    		return rs;
    	}
    }

json格式数据打印结果:

随便添加了几首歌曲测试一下

![70][]

[70]: /images/20220518/29ea0c1ccdb345288a537c86c001de86.png