2021-09-11最近app项目视频播放不了的问题解决

项目场景：

解决最近app项目视频播放不了的问题，极大可能是路径没写对

---

问题描述：

这里去后端请求视频资料的url

传给后端的controller层

跳进service层

再看其实现impl

当点击一个视频时。可以看控制台filepath 是d:/file/
上图当中红框里path是 /files/video/T_【视频版】中国疾控中心提示：外出怎么做？.mp4

灰色被注释掉的是从旧系统搬过来的。这行代码不能用的原因是一个是数据库里存的文件名前已经加了video/、ppt/这种了。因此不需要拼接了。还有是这个path是直接传给前端的。如果前面拼接了 filepath(也就是d:/file/)。d:/file/前端是无法访问的。

这里我们选择拼接的是 /files/ 。也就是配置一个虚拟路径，只要访问这个路径就相当于访问磁盘中的某个文件夹

这样只要访问files就相当于访问磁盘上tpConfig.getFileDir()这个路径。而通过下面两张图可以知道tpConfig.getFileDir()其实就是d:/file/。也就是只要访问files就相当于访问磁盘上d:/file/

app前端的修改：

这里后端传给前端的url是没有问题的。但还是访问不了视频。

---

解决方案：

前端里后端传回离开的url赋值给了this.videoUrl。 而最终播放用的this.videoSrc路径需要在前面拼接this.apiScr（也就是主机加端口号）。

从下面两张图可以看出this.video 实际上就是http://127.0.0.1:8096/apis。但是这样除了主机加端口号外还拼接了/api。这样会导致视频播放不了。因此在上图两个红框的上一行可以看到我使用substring()方法把最后的/apis剪切去掉从新拼接。


最后视频可以播放了！