电信天翼视联开发文档:
官方文档地址:
https://vcp.dlife.cn/portal/document
-
注册天翼应用程序
在针对不同的应用程序时,请求接口时有不同的传参需求(我们使用的是标准应用)
1.开发者ID
AppID(应用ID),688***612
appld作为必须的公共参数,在请求每一个接口时都必须传递
AppSecret(应用密钥), 2eec***260
AppSecret不是公共的参数,传参时不需要传递。appSecret作为params和signtnature的加密key
2.授权回调域名
授权回调,是指在获取authCode的时候,天翼平台向应用平台返回的一个地址,该地址会在请求getAuthPageUrl时作为参数传递,必须要和注册回调域名一致
以下是获取authCode的过程:
第一步:发起getAuthPageUrl请求,该请求成功返回一个地址
第二步:使用企业主账号扫码登录(必须是企业主账号,才有设备信息)
第三步:回调到getAuthPageUrl传入的请求地址(该地址也必须在授权回调中配置),并且在地址后面多了两个参数,其中一个就是我们需要的authCode
3.业务域名
在业务域名配置部署的服务器地址后,理论不会出现跨域问题
请求接口的规范
在请求所有的接口时都是post请求和需要一些公共请求参数
请求头设置:
Content-Type | application/x-www-form-urlencoded;charset=utf-8 |
apiVersion | 2.0 |
公共请求参数
其中需要注意
1.params,需要所有公共参数(除signature)都按照参数1=值&参数2=值&...拼接,
然后通过xxtea加密,xxtea加密时需要传入两个参数(string: 拼接的参数,key:appSecrert)
2.signature,需要使用签名算法CryptoJS.HmacSHA256
安装npm install crypto-js
导入import CryptoJS from "crypto-js";
CryptoJS.HmacSHA256两个参数(string: 拼接的参数(注意要求),key:appSecrert)
3.时间戳参数要一致,切注意version(‘’V1.0/’1.1’)在最后的解密中起不同的作用
4.最后所有参数都要按照参数1=值&参数2=值&...拼接
对请求接口的函数进行封装
// config是每个接口需要传递的私有参数,参数类型:object
const setBody = (config) => {
// 密钥,用于加密和解密的key
let appSecret = "2e*********************260";
// 获得统一的时间戳
let timestamp = Math.round(new Date());
// 公共参数
let dataCommen = {
appId: "688*******12",
version: "V1.0", //获得视频加密码的时候,v1.0使用xxtea解密,1.1使用spa解密
clientType: 3,
timestamp: timestamp,
};
if (config) {
// 合并私有参数和公共参数
Object.assign(config, dataCommen);
// 获取params 1、按照参数1=值&参数2=值&.拼接
let dataArray = [];
for (const key in config) {
let zs = key + "=" + config[key];
dataArray.push(zs);
}
let dataString = dataArray.join("&");
// 获取params 2、使用xxtea.js进行加密
let params = xxtea_encrypt(dataString, appSecret).toUpperCase();
// 获取signature ,注意拼接顺序,通过cryptojs加密
let content =
dataCommen.appId +
dataCommen.clientType +
params +
dataCommen.timestamp +
dataCommen.version;
config.signature = CryptoJS.HmacSHA256(content, appSecret).toString();
config.params = params;
}
// 最后将所有参数拼接为参数1=值&参数2=值...格式
let dataArray2 = [];
for (let key in config) {
let zaa = key + "=" + config[key];
dataArray2.push(zaa);
}
let requestdata = dataArray2.join("&");
// 得到请求参数
return requestdata;
};
响应视频地址解密
version的参数值决定了在获取到视频数据信息时解密的方式
V1.1 | Xxtea 参数(data,appSecret) |
1.0 | RSA |
let dexxteacode = JSON.parse(
//由于我们前面使用的是version=“V1.0”所以使用xxtea解密
//两个参数(需要解密的字符串,appSecret密钥)
xxtea_decrypt(xxteacode, "2ee***************************260")
);
视频的展示
天翼平台提供了三种视频流,分别是(rtsp,rtmp,hls)
其中对于前端比较方便的是hls(但是相对于其他两种,画质略低)
Hls的视频流显示[videojs]
存在的问题
常见问题参考文档:
https://vcp.dlife.cn/portal/QA
videojs包的问题:
Error:videojs is no defined.....
原因:videojs有问题
解决方法:用以下方式导入
import videojs from "video.js"
import "video.js/dist/video-js.css"
import video_zhCN from 'video.js/dist/lang/zh-CN.json'
videojs.addLanguage('zh-CN', video_zhCN)
跨域问题:
根据对接人员说的在业务域名中配置服务器地址,发送请求时不会出现跨域问题。
Error在测试案例中,仍然出现跨域问题,
解决方法:使用中转接口进行处理