66 lines
1.9 KiB
Vue
66 lines
1.9 KiB
Vue
|
<template>
|
||
|
|
<div id="player"></div>
|
||
|
|
</template>
|
||
|
|
<script script lang="ts" setup>
|
||
|
|
import api from "@/axios";
|
||
|
|
import { Ref, ref, watch, onMounted, onBeforeMount, reactive, getCurrentInstance } from 'vue';
|
||
|
|
import { useRouter } from 'vue-router';
|
||
|
|
const router = useRouter();
|
||
|
|
const infoData = ref();
|
||
|
|
onMounted(() => {
|
||
|
|
var data={
|
||
|
|
cameraIndexCode:router.currentRoute.value.query.pointId
|
||
|
|
}
|
||
|
|
api.post('/multialarm/hik/device/preview',data).then((res) => {
|
||
|
|
console.log('router222',res,res["code"] )
|
||
|
|
var code=res["code"];
|
||
|
|
if(code==0){
|
||
|
|
var data=JSON.parse(res["data"]);
|
||
|
|
var playURL=data["data"]["url"];
|
||
|
|
playURL = playURL.replace('ws://218.76.54.20:559',`wss://${location.host}:443/haikang_play`)
|
||
|
|
var IS_MOVE_DEVICE = document.body.clientWidth < 992 // 是否移动设备
|
||
|
|
var MSE_IS_SUPPORT = !!window.MediaSource // 是否支持mse
|
||
|
|
var player = new window.JSPlugin({
|
||
|
|
szId: 'player',
|
||
|
|
szBasePath: "./",
|
||
|
|
iMaxSplit: 1,
|
||
|
|
iCurrentSplit: IS_MOVE_DEVICE ? 1 : 2,
|
||
|
|
openDebug: true,
|
||
|
|
oStyle: {
|
||
|
|
borderSelect: IS_MOVE_DEVICE ? '#000' : '#FFCC00',
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
var index=2;
|
||
|
|
playVideo();
|
||
|
|
function playVideo(){
|
||
|
|
player.JS_Play(playURL, { playURL:playURL, mode:1 }, 0).then(
|
||
|
|
() => { console.log('realplay success') },
|
||
|
|
e => {
|
||
|
|
console.log('?')
|
||
|
|
index--;
|
||
|
|
if(index<=0){
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
var inUrl="192.168.10.240:559"
|
||
|
|
var outUrl="218.76.54.20:559";
|
||
|
|
playURL=playURL.replace(outUrl,inUrl)
|
||
|
|
playVideo();
|
||
|
|
}
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
}else{
|
||
|
|
alert("播放失败")
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
#player{
|
||
|
|
height:100%;
|
||
|
|
width:100%;
|
||
|
|
background:#000;
|
||
|
|
}
|
||
|
|
</style>
|