需求
对接海康威视监控（单页面10路）。
项目有以下限制：
①作为页面嵌入在C端程序。（排除了视频WEB插件 V1.5.2，原因是插件播放的视频在C端不见了）
②未知是否全部支持ws取流。（排除了H5视频播放器开发包 V2.1.2）
方案
通过内网部署的安防管理平台对接api获取RTSP流在前端播放。
对接接口前需要先做好安全认证。认证流程为：拼接签名字符串=>以appSecret为密钥，使用HmacSHA256算法对签名字符串生成消息摘要=>对消息摘要使用BASE64算法生成签名（签名过程中的编码方式全为UTF-8）。
获取到rtsp流后播放方案待定：有使用了webrtcstreamer的项目方案，可以顺利播放rtsp流测试视频，几乎无延迟，不卡顿，但是该项目只支持视频h264编码，因此需要另找方案。这里先进行安全认证流程
流程
1.下载OpenApi签名生成工具 V1.0.0，填入相关信息（相关参数在文档均有说明）
点击生成签名：gkIlj//qVxApkvisazGlc50406AfYH/yrCrWZiaCNfo=
这个步骤主要是为了验证自己加密的正确性
2.引入cryto.js用其中的函数进行加密
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
3.配置headers以及签名计算中需要的相关数据
const hikConfig = {
normal: {
httpMethod: "POST",
Accept: "*/*",
ContentType: "application/json",
},
xCa: {
xCaKey: "20917555",
xCaTimestamp: timestamp,//时间戳
//xCaNonce:"",//UUID
xCaSignatureHeaders: "x-ca-key,x-ca-timestamp",
secret: "UpxFUpGEKrXUFpgsTF8i"
},
path: "/artemis/api/resource/v1/org/advance/orgList",
}
4.进行签名加密处理
function signature(config) {
let signString = Object.values(config.normal).join("\n")
//此处签名字符串待优化
signString = signString + '\n' + 'x-ca-key:' + config.xCa.xCaKey + '\n' + 'x-ca-timestamp:' + config.xCa.xCaTimestamp + '\n' + config.path
// 使用 HmacSHA256 算法进行加密
const encrypted = CryptoJS.HmacSHA256(signString, config.xCa.secret);
// 将加密结果转换为 Base64 字符串
const encryptedBase64 = CryptoJS.enc.Base64.stringify(encrypted);
return encryptedBase64
}
计算完需要和前面用工具生成的签名对比是否正确
5.headers带上即可
const hikHeaders = {
"Accept": hikConfig.normal.Accept,
"Content-Type": hikConfig.normal.ContentType,
"x-ca-key": hikConfig.xCa.xCaKey,
// "x-ca-nonce":hikConfig.xCa.xCaNonce,
"x-ca-timestamp": hikConfig.xCa.xCaTimestamp,
"x-ca-signature-headers": hikConfig.xCa.xCaSignatureHeaders,
"x-ca-signature": signature(hikConfig),
}
