视频流适配内外网
This commit is contained in:
@@ -11,10 +11,7 @@ import { deviceManageList } from '#/api/sis/deviceManage/index.js';
|
|||||||
import { deviceChannelList } from '#/api/sis/deviceChannel/index.js';
|
import { deviceChannelList } from '#/api/sis/deviceChannel/index.js';
|
||||||
import mpegts from 'mpegts.js';
|
import mpegts from 'mpegts.js';
|
||||||
import { message } from 'ant-design-vue';
|
import { message } from 'ant-design-vue';
|
||||||
import {
|
import { addMediaStreamProxy } from '#/api/sis/stream/index.js';
|
||||||
addFFmpegMediaStreamProxy,
|
|
||||||
addMediaStreamProxy,
|
|
||||||
} from '#/api/sis/stream/index.js';
|
|
||||||
import { checkHEVCSupport } from '#/utils/video.js';
|
import { checkHEVCSupport } from '#/utils/video.js';
|
||||||
|
|
||||||
// 地图全局对象
|
// 地图全局对象
|
||||||
@@ -114,7 +111,8 @@ function loadCameraData() {
|
|||||||
function doPlayer(nodeData) {
|
function doPlayer(nodeData) {
|
||||||
if (mpegts.isSupported()) {
|
if (mpegts.isSupported()) {
|
||||||
streamProxy(nodeData, (res) => {
|
streamProxy(nodeData, (res) => {
|
||||||
const url = res.flv;
|
const host = window.location.host;
|
||||||
|
const url = `http://${host}/${res.app}/${res.streamId}.live.flv`;
|
||||||
// 将url 绑定到 nodeData
|
// 将url 绑定到 nodeData
|
||||||
nodeData.url = url;
|
nodeData.url = url;
|
||||||
closeVideo(currentPlayer);
|
closeVideo(currentPlayer);
|
||||||
@@ -152,8 +150,8 @@ function streamProxy(params, cb) {
|
|||||||
if (isSupportH265) {
|
if (isSupportH265) {
|
||||||
addMediaStreamProxy(params).then((res) => cb(res));
|
addMediaStreamProxy(params).then((res) => cb(res));
|
||||||
} else {
|
} else {
|
||||||
// addMediaStreamProxy(params).then((res) => cb(res));
|
addMediaStreamProxy(params).then((res) => cb(res));
|
||||||
addFFmpegMediaStreamProxy(params).then((res) => cb(res));
|
// addFFmpegMediaStreamProxy(params).then((res) => cb(res));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<Page :auto-content-height="true">
|
<Page :auto-content-height="true">
|
||||||
<div class="flex h-full gap-[8px]">
|
<div class="flex h-full gap-[8px]">
|
||||||
<div class="h-full tree-box">
|
<div class="tree-box h-full">
|
||||||
<DpTree class="h-full w-[300px]" @checked="onNodeChecked" />
|
<DpTree class="h-full w-[300px]" @checked="onNodeChecked" />
|
||||||
</div>
|
</div>
|
||||||
<div class="bg-background flex-1">
|
<div class="bg-background flex-1">
|
||||||
@@ -254,7 +254,7 @@ let isSupportH265 = false;
|
|||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 检测浏览器是否支持h265
|
// 检测浏览器是否支持h265
|
||||||
isSupportH265 = checkHEVCSupport();
|
isSupportH265 = checkHEVCSupport();
|
||||||
setInterval(catchUp, 10000);
|
setInterval(catchUp, 120000);
|
||||||
});
|
});
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
|
@@ -337,7 +337,6 @@ function doPlayer(nodeData: any, index: number = 0) {
|
|||||||
player,
|
player,
|
||||||
key: nodeData.id,
|
key: nodeData.id,
|
||||||
data: nodeData,
|
data: nodeData,
|
||||||
el: videoElement,
|
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
console.log('视频播放元素获取异常');
|
console.log('视频播放元素获取异常');
|
||||||
@@ -381,15 +380,12 @@ function catchUp() {
|
|||||||
if (playerData) {
|
if (playerData) {
|
||||||
const { player, el } = playerData;
|
const { player, el } = playerData;
|
||||||
const end = player.buffered.end(player.buffered.length - 1);
|
const end = player.buffered.end(player.buffered.length - 1);
|
||||||
const { currentTime } = el;
|
|
||||||
if (end && currentTime) {
|
|
||||||
const diff = end - el.currentTime;
|
const diff = end - el.currentTime;
|
||||||
if (diff > 2) {
|
if (diff > 2) {
|
||||||
// 如果延迟超过2秒
|
// 如果延迟超过2秒
|
||||||
el.currentTime = end - 0.5; // 跳转到接近直播点
|
el.currentTime = end - 0.5; // 跳转到接近直播点
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -397,7 +393,7 @@ let isSupportH265 = false;
|
|||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 检测浏览器是否支持h265
|
// 检测浏览器是否支持h265
|
||||||
isSupportH265 = checkHEVCSupport();
|
isSupportH265 = checkHEVCSupport();
|
||||||
setInterval(catchUp, 10000);
|
setInterval(catchUp, 120000);
|
||||||
});
|
});
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
|
Reference in New Issue
Block a user