vue+java实现在线播放mp4视频

java:

读取本地视频文件的流然后给response的输出流

  File file = new File("/Users/zhangqingtian/Documents/水库/Floodforecast/static/" + videoName);
        BufferedInputStream inputStream = new BufferedInputStream(new FileInputStream(file));
        response.setContentType("video/mp4");
        response.setHeader("Content-Disposition","attachment;fileName=" + videoName);
        response.setHeader("Content-Length", String.valueOf(file.length()));
        ServletOutputStream outputStream = response.getOutputStream();
        IOUtils.copy(inputStream,outputStream);

vue:

首先用vue-video--player,vue2版本安装 5.0.1

npm install [email protected]

视频组件:

使用视频组件，传入是否展示展示和文件的url

访问后端接口获取视频url

 loadVideo() {
            request({
                url: "/video/7d515b22c4958598c0fbd1e6290a5ca5.mp4",
                method: "get",
                  //接收类型是arraybuffer
                responseType: "arraybuffer"
            }).then(
                response => {
                    const videoBlob = new Blob([response.data], { type: 'video/mp4' });
                    const videoUrl = URL.createObjectURL(videoBlob);
                    this.videoSrc = videoUrl
                    this.isVideoShow = true
                }
            );

        },

使用视频组件