Libt
/
multiple-police-situations
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

视频问题修改

This commit is contained in:
libingtao 2024-07-26 16:19:43 +08:00
parent 7038e38809
commit e4986834f2
3 changed files with 103 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
analyze.html
View File

File diff suppressed because one or more lines are too long

210
src/views/page/hkplay.vue
View File

@ -1,123 +1,109 @@
<template>
<div id="player"></div>
<div id="player"></div>
</template>
<script lang="ts" setup>
import api from '@/axios'
import { Ref, ref, watch, onMounted, onBeforeMount, onBeforeUnmount, reactive, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const infoData = ref()
var curIndex = 0 // 当前窗口下标
let myPlugin: any
onMounted(() => {
if (typeof window.JSPlugin === 'undefined') {
console.error('JSPlugin is not loaded')
return
} else {
console.log('JSPlugin加载成功')
}
let date = {
pointId: router.currentRoute.value.query.pointId,
useTLS: 0,
}
if (process.env.NODE_ENV === 'production') {
date.useTLS = 1
}
import api from '@/axios'
import { Ref, ref, watch, onMounted, onBeforeMount, onBeforeUnmount, reactive, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const infoData = ref()
var curIndex = 0 // 当前窗口下标
let myPlugin : any
onMounted(() => {
if (typeof window.JSPlugin === 'undefined') {
return
} else {
}
let date = {
pointId: router.currentRoute.value.query.pointId,
useTLS: 0,
}
if (process.env.NODE_ENV === 'production') {
date.useTLS = 1
}
api.post('/multialarm/video/preview', { ...date }).then((res) => {
console.log('router222', res)
console.log('播放地址', res.data.videoUrl)
var code = res['code']
if (code == 0) {
var playURL = res.data.videoUrl
var IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
var MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
myPlugin = new window.JSPlugin({
// 当容器div#play_window有固定宽高时，可不传iWidth和iHeight，窗口大小将自适应容器宽高
// iWidth: 600,
// iHeight: 400,
szId: 'player', //需要英文字母开头，唯一性，必填
szBasePath: './', // 必填,与h5player.min.js的引用目录一致
iMaxSplit: 1, // 分屏播放，默认最大分屏4*4
iCurrentSplit: IS_MOVE_DEVICE ? 1 : 2,
openDebug: true,
oStyle: {
borderSelect: IS_MOVE_DEVICE ? '#000' : '#FFCC00',
},
bSupporDoubleClickFull: true, //是否支持双击全屏，默认true
})
myPlugin
.JS_SetWindowControlCallback({
pluginErrorHandler: function (index: any, iErrorCode: any, oError: any) {
console.error('__________pluginErrorHandler错误码________________', index, iErrorCode, oError)
api.post('/multialarm/video/preview', { ...date }).then((res) => {
// console.log('router222', res)
console.log('播放地址', res.data.videoUrl)
var code = res['code']
if (code == 0) {
var playURL = res.data.videoUrl
// var playURL = 'wss://w.hnjinglian.cn:2563/haikang play/openUrl/w64vRni'
var IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
var MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
myPlugin = new window.JSPlugin({
// 当容器div#play_window有固定宽高时，可不传iWidth和iHeight，窗口大小将自适应容器宽高
// iWidth: 600,
// iHeight: 400,
szId: 'player', //需要英文字母开头，唯一性，必填
szBasePath: './', // 必填,与h5player.min.js的引用目录一致
iMaxSplit: 1, // 分屏播放，默认最大分屏4*4
iCurrentSplit: IS_MOVE_DEVICE ? 1 : 2,
openDebug: true,
oStyle: {
borderSelect: IS_MOVE_DEVICE ? '#000' : '#FFCC00',
},
bSupporDoubleClickFull: true, //是否支持双击全屏，默认true
})
myPlugin.JS_SetWindowControlCallback({
pluginErrorHandler: function (index : any, iErrorCode : any, oError : any) {
//插件错误回调
// do you want...
// 取流失败，流中断等错误都会触发该回调函数，请自行对照错误码表进行判断。
// 业务上层可在此做一些个性化操作，如：个性化错误信息展示，重新取流等。
},
})
.then((res: any) => {
console.log('JS_SetWindowControlCallback________________', res)
})
},
})
.then((res : any) => {
})
var controlIndex = 2
function playVideo() {
console.log('____________playURL:', playURL)
console.log('____________curIndex:', curIndex)
// JS_Play 参数说明
// JS_Play(url, config, windowIndex, startTime, endTime)
myPlugin
.JS_Play(
playURL,
{
playURL: playURL, // 流媒体播放时必传
mode: 1, // 解码类型：0=普通模式; 1=高级模式 默认为0
},
curIndex //当前窗口下标
)
.then(
() => {
console.info('JS_Play success')
// do you want...
},
(e: any) => {
console.log('网络流中断')
controlIndex--
if (controlIndex <= 0) {
return
}
console.info('JS_Play failed:', e)
playVideo()
}
)
}
playVideo()
} else {
alert('播放失败')
}
})
})
var controlIndex = 2
function playVideo() {
myPlugin
.JS_Play(
playURL,
{
playURL: playURL, // 流媒体播放时必传
mode: 1, // 解码类型：0=普通模式; 1=高级模式 默认为0
},
curIndex //当前窗口下标
)
.then(
() => {
},
(e : any) => {
// console.log('网络流中断')
controlIndex--
if (controlIndex <= 0) {
return
}
// console.info('JS_Play failed:', e)
playVideo()
}
)
}
playVideo()
} else {
alert('播放失败')
}
})
})
// 停止播放断开 ws 连接
onBeforeUnmount(() => {
myPlugin.JS_Stop(curIndex).then(
() => {
console.info('JS_Stop success')
// do you want...
},
(err: any) => {
console.info('JS_Stop failed:', err)
// do you want...
}
)
})
// 停止播放断开 ws 连接
onBeforeUnmount(() => {
myPlugin.JS_Stop(curIndex).then(
() => {
console.info('JS_Stop success')
// do you want...
},
(err : any) => {
console.info('JS_Stop failed:', err)
// do you want...
}
)
})
</script>
<style scoped lang="scss">
#player {
height: 100%;
width: 100%;
background: #000;
}
#player {
height: 100%;
width: 100%;
background: #000;
}
</style>

6
src/views/page/index.vue
View File

@ -1059,12 +1059,12 @@ const pointCode = ref()
if (a.deviceType == '00') {
if (a.alarmType == 'isc') {
try {
router.push({ path: '/index/hkplay', query: { pointId: a.pointId } })
// let routeData = router.resolve({ path: '/index/hkplay', query: { pointId: a.pointId } })
// router.push({ path: '/index/hkplay', query: { pointId: a.pointId } })
let routeData = router.resolve({ path: '/index/hkplay', query: { pointId: a.pointId } })
// console.log('🚀 ~ routeData:', JSON.stringify(routeData))
// window.location.href = routeData.href
// window.open(routeData.href, '_blank')
window.open(routeData.href, '_blank')
// window.open('http://172.10.10.161:9527/#/index/hkplay?pointId=43000000581314000013', '_blank') //直接跳要么白屏，要么说未找到token
// window.open('https://www.hndyjqrh.cn/#/index/hkplay?pointId=43000000581314000013', '_blank')
} catch (error) {