<template>
|
<div style="width:100%; height: 100%;">
|
<camera-player :cameraID="query.cameraId" :rtspUrl="query.rtspUrl" :isGb="query.gb28181 === '1'"></camera-player>
|
</div>
|
</template>
|
|
<script>
|
// 接口使用
|
// 参数 cameraId 摄像机id, rtspUrl 摄像机rtsp地址, gb28181 是否是国标摄像机(1 或 0)
|
// http://192.168.20.191:7003/view/cameraPlayer/index.html?cameraId=e7e6157a-5929-4e78-b390-e365141169c8&rtspUrl=rtsp://admin:a1234567@192.168.5.51:554/h264/ch1/main/av_stream
|
|
import CameraPlayer from "../components/player"
|
|
export default {
|
name: "BasicCameraPlayer",
|
components: {
|
CameraPlayer
|
},
|
data() {
|
return {
|
query: {
|
cameraId: "",
|
rtspUrl: "",
|
gb28181: "0"
|
}
|
}
|
},
|
mounted() {
|
this.urlParse()
|
},
|
methods: {
|
urlParse() {
|
let url = window.location.search
|
let obj = {}
|
let reg = /[?&][^?&]+=[^?&]+/g
|
let arr = url.match(reg)
|
if (arr) {
|
arr.forEach((item) => {
|
let temArr = item.substring(1).split("=")
|
let key = decodeURIComponent(temArr[0])
|
let value = decodeURIComponent(temArr[1])
|
obj[key] = value
|
if (key == "rtspUrl") {
|
obj[key] = this.rtspParse(value)
|
}
|
})
|
}
|
this.query = Object.assign({}, this.query, obj)
|
console.log("cameraPlayer:", this.query)
|
},
|
// 对传入的rtsp密码进行urlEncode处理
|
rtspParse(input) {
|
if (!input.length || input.indexOf("rtsp://") != 0) {
|
return
|
}
|
|
let userinfoSplitPos = input.indexOf(":", 7)
|
let userinfoEndPos = input.lastIndexOf("@")
|
if (userinfoSplitPos == -1 || userinfoEndPos == -1 || userinfoEndPos < userinfoSplitPos) {
|
return
|
}
|
|
let usrPassword = input.slice(userinfoSplitPos + 1, userinfoEndPos)
|
let encodePassword = encodeURIComponent(usrPassword)
|
|
return input.replace(usrPassword, encodePassword)
|
}
|
}
|
}
|
</script>
|
