通过接口播放视频

接口

    @PostMapping("/getVideo")
    public readVideo<byte[]> getVideo(@RequestBody Map<String,Object> map, HttpServletResponse response) throws Exception {
try {
            String path = map.get("url").toString();//文件路径，例：E://files//vd.mp4
            HttpHeaders headers = new HttpHeaders();
            headers.setContentType(MediaType.APPLICATION_OCTET_STREAM);
            headers.setContentDispositionFormData("attachment", path);
            responseEntity = new ResponseEntity<byte[]>(FileUtils.readFileToByteArray(new File(path)), headers, HttpStatus.CREATED);
            return responseEntity;
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

html

<div id="id" v-loading="loading"></div>

data

loading:false

 

js

        videoAjax(url){
               axios.post(后台路径+'/getVideo', 
                {
                    url : url
                },{
                responseType: 'blob'
                },{
                withCredentials: true
                }).then((res)=>{
                  console.log(res)
                    var html = "<video autoplay='true' height='100%' width='100%' controls='controls' loop='true' src='"+window.URL.createObjectURL(new Blob([res.data]))+"' ></video> ";
                    document.getElementById('id').innerHTML = html;
                    this.loading = false;
                }).catch(function (response) {
                     console.log(response);
                });
        },