[毕业设计]一个带后端的影音播放app

前言

之前写毕业设计的时候，指导老师问我们搞什么，并不限制范围，绝大部分人选择的都是搞博客。当时因为和指导老师比较熟的缘故，他比较希望我搞安卓，但我感觉纯粹的安卓有些许单调，就打算搞个带后端和管理系统app。正好当时大据老师出了博客系统的视频，然后我就跟着博客视频做好了系统的前端和后端部分。因为需求比较简单，我当时看完增删查改就开始搞了。期间在考虑用什么视频播放框架，当时正好群里有人问视频播放框架用什么比较好，断点哥推荐了一个b站出的框架，我就直接拿来用了。

项目展示

安卓端

电视部分

功能描述 电视部分是使用了基于B站开发的IJKPlayer框架的改良版GSYvideoplayer播放框架。因为支持m3u8格式的缘故，所以我找了一些电视台的m3u8的地址。这样之后，就可以在手机上看电视了，和电视上播放的有那么几秒的延迟。除了可以看电视之外，理论上你可以找来任何直播的m3u8地址填进去，这样能搞的事情可太多了。

电影部分

功能描述 电影部分实际上调用了网络上的解析接口，因为版权的缘故，我项目开源地址里不会提供任何地址。一开始这部分我用的是系统自带的webview进行加载，后来测试中发现了很多很多的问题，然后就换成了腾讯开发的一个webview框架。演示中这种效果我进行了加速，实际上的操作是用户找到想看的视频之后，在任意位置长按三秒会自动进行解析跳转到播放页面。我当时首先想到的是在下方设置一个播放的按钮，遇到需要播放的在进行播放，实际编写过程中遇到了我没法解决的问题。索性放弃这种方案，直接来个长时间按的判断，反正正常使用过程中没有人会长时间在一个界面按三秒。

音乐部分

功能描述 音乐部分这里用了三个框架，一个是圆形的进度条CicleProgreessdialog框架，persistentsearch搜索框框架。然后在gitee上找到了一个开源的仿网易云播放框架。接口部分用的是网络公开的接口。操作逻辑是用户输入想要搜索的歌曲之后会调用搜索接口，接口里包含了音乐的播放地址，然后把播放地址传入播放器中就可以实现播放音乐的功能了。

管理系统

登陆功能

功能描述 登陆界面完全是按照大据老师视频里写的，不过稍微改了个主题颜色。登陆之后那个七日访问量是一个静态的数据，当时想搞来着来着，没想好数据库怎么设计。最后索性直接放在哪里了。然后那个系统内存使用情况的数据是真的，检测的是用户的还是系统的我忘记了，滩友有兴趣可以自己试试。

修改功能

功能描述 修改功能当用户修改数据后，点击确定之后，除了后台更新数据，前台立马重新加载数据。这样就做到了更新完成之后能马上显示出来。

用户管理

功能描述 用户管理这个功能只有超级管理员才可以操作，管理员不具备用户管理功能。当时后端部分按照大据老师的视频已经实现了不同用户能访问不同的结构，然后难点在于如何在vue中实现这种功能。当时的普遍的解决方案是直接从后台获取用户管理的路由表，不同权限的用户获取的路由表是不一样的。后来我没有采用这种方法，而是在前台判断访问的是那个权限的用户，如果是管理员就分配管理员的路由表，如果是超级管理员就分配超级管理员的路由表。

核心功能

安卓端

安卓端最难的功能在于如何实现视频解析。当时我注意到腾讯视频页面中，非视频页面和视频页面的url是不同的，然后电脑和手机的url也是不同的，只需要把这些处理好了就能实现我们想要的功能了。这部分核心代码贴在下面了。 相关代码

	String url = rold_url + mWebView.getUrl();

        url = url.replace("http://m.v.qq.com/x/m/play", "https://v.qq.com/x/cover/");
        url = url.replace("?cid=", "/");
        url = url.replace("&vid=","/");
        url = url + ".html";

        Log.d("CLJZ", "第二次获取的网址为: " + url);

        Intent intent = new Intent(getContext(), VideoActivity.class);
        intent.putExtra("base_url", url);
        startActivity(intent);

管理系统

管理系统中，最难的部分在于不同用户分配不同的路由表，我用的最笨的办法直接写两个路由表。相关部分的核心代码如下。

this.$axios.get("/user/check-token").then((response) => {
      let res = response.data;
      if (res.code === 20000) {
        if (res.data.roles === "role_root") {
          console.log("是超级管理员");
          let menuList = async[0];
          this.menuList = menuList.children;
        } else {
          console.log("是普通管理员");
          let menuList = routes[0];
          this.menuList = menuList.children;

        }
      }
    }), (response) => {console.log("error");};

项目地址

audio-visual 项目部署的方法我在gitee中进行了说明，需要注意的是数据库中是没有任何数据的，需要自行添加用户数据，具体的添加方法在gitee中也进行了说明。相关的解析接口我这里不提供。需要接口文档的在评论区留下邮箱，我发给你！