zhgdlarge/src/views/sevenLargeScreen/videoManagement/ckplayerComp.vue

<!--ckplayer 视频播放-->
<template>
	<div style="height: 100%">
		<video :id="'videoItem' + name" controls autoplay style="width: 100%; height: 100%; object-fit: fill" />
	</div>
</template>

<script>
import Srs from "@/assets/js/srs.sdk";
export default {
	props: ["videoUrls", "autoPlay", "poster", "deviceIp", "name"],
	data() {
		return {
			player: "",
			rtcPlayer: null
		};
	},
	mounted: function () {
		console.log(this.videoUrls, this.deviceIp, this.autoPlay, this.name, 666);
		this.player = document.getElementById("videoItem" + this.name);
		//方法一：使用srs.sdk.js
		this.rtcPlayer = new Srs.SrsRtcWhipWhepAsync();
		this.rtcPlayer.play(this.videoUrls);
		// video标签
		this.player.srcObject = this.rtcPlayer.stream;
		// 方法二：使用jswebrtc.min.js
		// new JSWebrtc.Player(this.url, { video: player, autoplay: true, });
	},
	beforeDestroy: function () {
		this.rtcPlayer.close();
	},
	methods: {}
};
</script>