Vue video播放视频流

html5 video标签播放视频流_video数据源为文件流-CSDN博客

 

 <el-dialogtitle=" ":visible.sync="dialogVisible"width="50%":before-close="handleClose"><videowidth="800"height="500"controls="controls"id="video"preload="auto"style="display:block;margin:auto;"><source :src="getVideos" type="video/mp4" /></video></el-dialog>getVideos: "",
dialogVisible: false,handleVideo(row) {this.loading = true;const param = {};param.fileName = row.fileName;param.fileId = row.fileId;fileDownload(param).then((res) => {if (res.data) {let blob = new Blob([res.data], { type: "video" });const getVideos = window.URL.createObjectURL(blob);this.getVideos = getVideos;this.dialogVisible = true;this.loading = false;} else {this.$confirm("当前文件不存在！", "提示", {type: "warning",center: true,customClass: "warn-dialog",}).then(() => {}).catch(() => {});this.loading = false;}}).catch((data) => {this.loading = false;this.$confirm("服务器忙", "提示", {type: "warning",center: true,customClass: "warn-dialog",}).then(() => {}).catch(() => {});});},