项目场景:

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


问题描述:

app视频加载重复 java app视频加载失败怎么解决?_html5


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

app视频加载重复 java app视频加载失败怎么解决?_app视频加载重复 java_02


传给后端的controller层

app视频加载重复 java app视频加载失败怎么解决?_app视频加载重复 java_03


跳进service层

app视频加载重复 java app视频加载失败怎么解决?_html5_04


再看其实现impl

app视频加载重复 java app视频加载失败怎么解决?_mvc_05


当点击一个视频时。可以看控制台filepath 是d:/file/

上图当中红框里path是 /files/video/T_【视频版】中国疾控中心提示:外出怎么做?.mp4

app视频加载重复 java app视频加载失败怎么解决?_javascript_06


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

app视频加载重复 java app视频加载失败怎么解决?_ide_07


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

app视频加载重复 java app视频加载失败怎么解决?_javascript_08


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

app视频加载重复 java app视频加载失败怎么解决?_html5_09


app视频加载重复 java app视频加载失败怎么解决?_html5_10

app前端的修改:

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


解决方案:

app视频加载重复 java app视频加载失败怎么解决?_mvc_11


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

app视频加载重复 java app视频加载失败怎么解决?_app视频加载重复 java_12


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

app视频加载重复 java app视频加载失败怎么解决?_javascript_13


app视频加载重复 java app视频加载失败怎么解决?_app视频加载重复 java_14


最后视频可以播放了!

app视频加载重复 java app视频加载失败怎么解决?_mvc_15