diff --git a/web_src/src/components/common/jessibuca.vue b/web_src/src/components/common/jessibuca.vue index c02960e6..bdb5793e 100755 --- a/web_src/src/components/common/jessibuca.vue +++ b/web_src/src/components/common/jessibuca.vue @@ -47,10 +47,6 @@ export default { }, props: ['videoUrl', 'error', 'hasAudio', 'height'], mounted() { - window.onerror = (msg) => { - // console.error(msg) - }; - console.log(this._uid) let paramUrl = decodeURIComponent(this.$route.params.url) this.$nextTick(() => { this.updatePlayerDomSize() @@ -61,15 +57,12 @@ export default { this.videoUrl = paramUrl; } this.btnDom = document.getElementById("buttonsBox"); - console.log("初始化时的地址为: " + this.videoUrl) - this.play(this.videoUrl) }) }, watch: { - videoUrl(newData, oldData) { - this.play(newData) - }, - immediate: true + videoUrl(val, _) { + this.play(val); + } }, methods: { updatePlayerDomSize() { @@ -87,70 +80,54 @@ export default { dom.style.height = height + "px"; }, create() { - let options = {}; - console.log("hasAudio " + this.hasAudio) - - jessibucaPlayer[this._uid] = new window.Jessibuca(Object.assign( - { - container: this.$refs.container, - autoWasm: true, - background: "", - controlAutoHide: false, - debug: false, - decoder: "static/js/jessibuca/decoder.js", - forceNoOffscreen: true, - hasAudio: typeof (this.hasAudio) == "undefined" ? true : this.hasAudio, - hasVideo: true, - heartTimeout: 5, - heartTimeoutReplay: true, - heartTimeoutReplayTimes: 3, - hiddenAutoPause: false, - hotKey: false, - isFlv: false, - isFullResize: false, - isNotMute: this.isNotMute, - isResize: false, - keepScreenOn: false, - loadingText: "请稍等, 视频加载中......", - loadingTimeout: 10, - loadingTimeoutReplay: true, - loadingTimeoutReplayTimes: 3, - openWebglAlignment: false, - operateBtns: { - fullscreen: false, - screenshot: false, - play: false, - audio: false, - record: false - }, - recordType: "webm", - rotate: 0, - showBandwidth: false, - supportDblclickFullscreen: false, - timeout: 10, - useMSE: location.hostname !== "localhost" && location.protocol !== "https:", - useOffscreen: false, - useWCS: location.hostname === "localhost" || location.protocol === "https", - useWebFullScreen: false, - videoBuffer: 0, - wasmDecodeAudioSyncVideo: true, - wasmDecodeErrorReplay: true, - wcsUseVideoRender: true + let options = { + container: this.$refs.container, + autoWasm: true, + background: "", + controlAutoHide: false, + debug: false, + decoder: "static/js/jessibuca/decoder.js", + forceNoOffscreen: false, + hasAudio: typeof (this.hasAudio) == "undefined" ? true : this.hasAudio, + heartTimeout: 5, + heartTimeoutReplay: true, + heartTimeoutReplayTimes: 3, + hiddenAutoPause: false, + hotKey: true, + isFlv: false, + isFullResize: false, + isNotMute: this.isNotMute, + isResize: false, + keepScreenOn: true, + loadingText: "请稍等, 视频加载中......", + loadingTimeout: 10, + loadingTimeoutReplay: true, + loadingTimeoutReplayTimes: 3, + openWebglAlignment: false, + operateBtns: { + fullscreen: false, + screenshot: false, + play: false, + audio: false, + record: false }, - options - )); + recordType: "mp4", + rotate: 0, + showBandwidth: false, + supportDblclickFullscreen: false, + timeout: 10, + useMSE: true, + useWCS: location.hostname === "localhost" || location.protocol === "https:", + useWebFullScreen: true, + videoBuffer: 0.1, + wasmDecodeErrorReplay: true, + wcsUseVideoRender: true + }; + console.log("Jessibuca -> options: ", options); + jessibucaPlayer[this._uid] = new window.Jessibuca({...options}); + let jessibuca = jessibucaPlayer[this._uid]; let _this = this; - jessibuca.on("load", function () { - console.log("on load init"); - }); - - jessibuca.on("log", function (msg) { - console.log("on log", msg); - }); - jessibuca.on("record", function (msg) { - console.log("on record:", msg); - }); jessibuca.on("pause", function () { _this.playing = false; }); @@ -158,44 +135,11 @@ export default { _this.playing = true; }); jessibuca.on("fullscreen", function (msg) { - console.log("on fullscreen", msg); _this.fullscreen = msg }); - jessibuca.on("mute", function (msg) { - console.log("on mute", msg); _this.isNotMute = !msg; }); - jessibuca.on("audioInfo", function (msg) { - console.log("audioInfo", msg); - }); - - jessibuca.on("bps", function (bps) { - // console.log('bps', bps); - - }); - let _ts = 0; - jessibuca.on("timeUpdate", function (ts) { - // console.log('timeUpdate,old,new,timestamp', _ts, ts, ts - _ts); - _ts = ts; - }); - - jessibuca.on("videoInfo", function (info) { - console.log("videoInfo", info); - }); - - jessibuca.on("error", function (error) { - console.log("error", error); - }); - - jessibuca.on("timeout", function () { - console.log("timeout"); - }); - - jessibuca.on('start', function () { - console.log('start'); - }) - jessibuca.on("performance", function (performance) { let show = "卡顿"; if (performance === 2) { @@ -205,33 +149,36 @@ export default { } _this.performance = show; }); - jessibuca.on('buffer', function (buffer) { - // console.log('buffer', buffer); - }) - - jessibuca.on('stats', function (stats) { - // console.log('stats', stats); - }) - jessibuca.on('kBps', function (kBps) { _this.kBps = Math.round(kBps); }); - - // 显示时间戳 PTS - jessibuca.on('videoFrame', function () { - - }) - - // - jessibuca.on('metadata', function () { - + jessibuca.on("videoInfo", function (msg) { + console.log("Jessibuca -> videoInfo: ", msg); + }); + jessibuca.on("audioInfo", function (msg) { + console.log("Jessibuca -> audioInfo: ", msg); + }); + jessibuca.on("error", function (msg) { + console.log("Jessibuca -> error: ", msg); + }); + jessibuca.on("timeout", function (msg) { + console.log("Jessibuca -> timeout: ", msg); + }); + jessibuca.on("loadingTimeout", function (msg) { + console.log("Jessibuca -> timeout: ", msg); + }); + jessibuca.on("delayTimeout", function (msg) { + console.log("Jessibuca -> timeout: ", msg); + }); + jessibuca.on("playToRenderTimes", function (msg) { + console.log("Jessibuca -> playToRenderTimes: ", msg); }); }, playBtnClick: function (event) { this.play(this.videoUrl) }, play: function (url) { - console.log(url) + console.log("Jessibuca -> url: ", url); if (jessibucaPlayer[this._uid]) { this.destroy(); } @@ -245,7 +192,6 @@ export default { jessibucaPlayer[this._uid].play(url); } else { jessibucaPlayer[this._uid].on("load", () => { - console.log("load 播放") jessibucaPlayer[this._uid].play(url); }); } @@ -286,11 +232,6 @@ export default { this.performance = ""; }, - eventcallbacK: function (type, message) { - // console.log("player 事件回调") - // console.log(type) - // console.log(message) - }, fullscreenSwich: function () { let isFull = this.isFullscreen() jessibucaPlayer[this._uid].setFullscreen(!isFull) diff --git a/web_src/src/components/dialog/devicePlayer.vue b/web_src/src/components/dialog/devicePlayer.vue index 9e4eea00..a5cff5d3 100755 --- a/web_src/src/components/dialog/devicePlayer.vue +++ b/web_src/src/components/dialog/devicePlayer.vue @@ -1,7 +1,7 @@