35 lines
812 B
Vue
35 lines
812 B
Vue
|
|
<script setup>
|
|||
|
|
import token from "@/utils/global.js";
|
|||
|
|
import axios from "axios";
|
|||
|
|
import videojs from "video.js";
|
|||
|
|
const player = videojs(this.$refs.videoPlayer, this.options); // 初始化播放器
|
|||
|
|
axios
|
|||
|
|
.post(
|
|||
|
|
"/video/m3u8",
|
|||
|
|
{
|
|||
|
|
// 发送的POST数据
|
|||
|
|
id: "",
|
|||
|
|
userId: "",
|
|||
|
|
filename: "",
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
headers: {
|
|||
|
|
Authorization: token.value,
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
)
|
|||
|
|
.then((response) => {
|
|||
|
|
// 处理响应数据,response.data 应该包含m3u8视频流数据
|
|||
|
|
player.src({ type: "application/x-mpegURL", src: response.data }); // 将m3u8数据流设置为视频源
|
|||
|
|
player.play(); // 开始播放视频流
|
|||
|
|
})
|
|||
|
|
.catch((error) => {
|
|||
|
|
// 处理错误
|
|||
|
|
});
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<div>
|
|||
|
|
<video ref="videoPlayer" class="video-js"></video>
|
|||
|
|
</div>
|
|||
|
|
</template>
|