大华监控前端及时预览（踩坑）
难点在后端，前端主要是文档太少了，前端难点主要是接入摄像头，摄像头接入了，剩下什么对讲、调整方向、变焦之类的就简单了。大华官网：https://open-icc.dahuatech.com/#/home
1.到官网下载插件大概demo，我是下载的插件然后安装了（安装选安装位置的时间记得单独建立一个文件夹，由于安装后内里的东西是直接散开的，没有本身的文件夹），
https://i-blog.csdnimg.cn/blog_migrate/45bdcdf9d8f30577c30abb5ddea8822f.png
ps:如果安装后页面仍然报找不到插件的错，大概重启电脑后播放视频表现找不到插件，多半是由于插件没有运行，1.安装的时间，最后扣问是否允许启动，肯定要选允许
2.如果已经选了不允许，在安装包里双击运行这个，插件就运行了（每次都要手动点击运行，发起卸载重装，实验第一点的方法）
https://i-blog.csdnimg.cn/blog_migrate/449e84480eba8e37f97f80ae75792bf9.png
2. 安装完之后会有个demo文件，可以直接点开index.html内里有例子和一些api也可以看，也可以在这里试试，填写后端给你的通道号和rtsp地点能不能播放，*本地测试接口未通的情况下必要电脑链接摄像头的网线接口
https://i-blog.csdnimg.cn/blog_migrate/99134c0acef999edfc81a91be1faa68d.png
3.可以播放的话，就可以把视频接入项目中了，demo内里这个文件内里有使用方法可以看看
https://i-blog.csdnimg.cn/blog_migrate/9730d312128c1756b645a60b00d661ff.png
3.1 引入
复制DHPlayer.js进项目里，找个地方放，我放在util文件下的
在main.js 引入
import DHPlayer from '@/utils/DHPlayer'
Vue.use(DHPlayer)
vue页面：
windowType：视频范例 0 及时，1录像
createSuccess： 插件创建成功时调用
video-id 记得给宽高，#dhplayer
<DHPlayer
ref="dhplayer"
video-id="dhplayer"
:window-type="0"
@createSuccess="createSuccess"
/>
*在网上搜的例子用到createSuccess，我们也必要找个方法，这个初始化成功之后，才气给视频播放地点，否则会报错。但是这个方法一直没被调用，可能是引入dhplayer.js版本题目，后面看源码就是没emit出去，于是手动改了源码（格式化一下dhplayer.js ,找到找个方法，加个emit）
createSuccess(){
this.$refs.dhplayer.setRealTime({
channelId: this.channelId,//后端给通道号
stdRtsp: true, // 默认false
path: `${this.playerUrl}?token=${this.playerToken}`,//后端给的地址，看你们咋拼接，需不需要token
});
}
setRealTime这个方法是我在demo文件DHplayer.vue里本身找的，你们有必要也可以看下这个文件，看有没有必要的，毕竟文档太少了
到这步视频就可以播放了。
剩下的就没啥难度了
4.对讲
对讲直接调后端接口+大华api接口就可以了
逻辑：点击开始对讲后，调后端接口，后端返回参数给你后，调setTalk方法。
竣事对讲，再调后端接口就行了，不必要再调setTalk方法。以是难点都在后端
this.$refs.dhplayer.setTalk({
path: `${data.url}?token=${data.token}`, //restp地址
audioType: data.audioType, // 音频类型 int0-default 1-PCM 2-G711a 3-AMR 4-G711U 5-G726 6-AAC 7-G722 8-G711
audioBit: data.audioBit, // 位数 int 816
sampleRate: data.sampleRate, // 采样频率8000 16000 32000 48000 8192
talkType: 1, // 对讲类型： 1 设备2通道
});
剩下的按照文档的例子来就行了。
放了一个demo包，可以运行下内里index.html 可以看页面功能对应的源码，我在网页本身下载的demo似乎没这个功能，以是放上来你们可以看看。
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]