vue3对接大华云睿摄像头（对讲，变焦，云台）

业务需求：对接大华云睿摄像头

功能：视频流预览，对讲，变焦，云台操控

操作误区：

1：播放flv/m3u8等格式视频

2：对讲操作需要跟后端对接

3：对讲只需要请求浏览器麦克风

（跟云睿的技术支持打了n个电话最后终于完美的解决了）

正片：

1：官网下载dom

地址

根据自己的需求下载dom

##:2：运行dom并替换资源

解压player文件夹并打开对接的文档

运行dom需要去官网上拿去到：client_id跟client_secret

// 访问秘钥，获取access_token需要，www.cloud-dahua.com/home/portal… 可以查看具体取值方法

// 客户端id，获取access_token需要，www.cloud-dahua.com/home/portal… 可以查看具体取值方法

3：vue3中使用（这里就只放部分代码搭配注释了）

<video-player ref="playerValue" id="player" :rtspURL="rtspURLValue" :audioURL="audioURL"
                            :isLive="true" @playError="playError" />

// 云睿视频流路径 rtsp格式
const rtspURLValue = ref();
// 对讲视频流
const audioURL = ref(null);
// 失败函数
function playError(e) {
    console.error(e)
}
// 初始化云睿播放器
        videoPlay.init([playerValue.value])
        const param = {
            "deviceId": ‘设备id’,
            "channelId": '0',
            "businessType": "real",
            "streamType": '0',
            "encryptMode": '0',
            "protoType": 'rtsp',
        }
        // 获取rtsp格式直播流
        let das = await InfoApi.createDeviceStreamUrl(param);
        rtspURLValue.value = das?.url
        setTimeout(() => {
            // 播放
            console.log(playerValue.value, 'playerValue');
            playerValue.value?.play();
            setTimeout(() => {
                playerValue.value.setAudioVolume(1)
            }, 2000)
        }, 2000)

// 浏览器摄像头信息
let audioStream;
async function talkMeda() {
    audioStream = await navigator.mediaDevices.getUserMedia({
        audio: {
            echoCancellation: true,
            noiseSuppression: true,
            autoGainControl: true
        }
    }).catch(err => {
        console.error("麦克风访问错误:", err);
        throw new Error("麦克风权限被拒绝");
    });
}
// 对讲
async function talk() {
    if (deviceType.value.deviceType == 9) {
        if (talkType.value == false) {
            talkType.value = true
            if (!audioStream) {
                talkMeda()
            }
            const param = {
                "deviceId": ‘设备id’,
                "channelId": '0',
                "businessType": "talk",
                "streamType": '0',
                "encryptMode": '0',
                "protoType": 'rtsp',
            }
            const data = await InfoApi.createDeviceStreamUrl(param);
            audioURL.value = data?.url
            await nextTick()
            // 云睿对讲函数
            playerValue.value.talk()
        } else {
            talkType.value = false
            // 关闭浏览器摄像头
            audioStream.getTracks()[0].stop();
        }
    } else {
        message.error('该设备不支持对讲操作');
        return;
    }
}