|
|
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>video</title>
</head>
<body>
<input type="button" value="登录" onclick="testLogin()" />
<input type="button" value="退出" onclick="testLogout()" />
<input type="button" value="查看设备列表" onclick="testShowPuList()" />
<input type="button" value="打开视频" onclick="testOpenVideo()" />
<input type="button" value="关闭视频" onclick="testCloseVideo()" />
<input type="button" value="全屏" onclick="testFullScreen()" />
<input type="button" id='id_GetUrl_Button' value="获取URL" disabled="disabled" onclick="testGetUrlVideo()" />
<input id="id_JustUrl_NoPlay" type='checkbox' />只获取Url，不进行播放
<div id="msg"></div>
<div id="id_video" style="width:500px; height:400px"></div>
<div id="id_url_info" style="width:500px; height:200px"></div>
</body>
</html>
<!-- <script type="text/javascript" src="./jsw.js"></script> -->
<!-- <script type="text/javascript" src="http://121.46.30.xxx:8081/js/jsw.js"></script> -->
<script type="text/javascript" src="https://121.46.30.xxx:9443/js/jsw.js"></script>
<script type="text/javascript">
var VEDIO_SESSION = null,
VEDIO_PUID = null,
VEDIO_CHANNELID = null,
LOGIN_SERVER = '121.46.30.xxx',//此处是服务器地址
LOGIN_PORT = 9701,
SWINIT_URL = "https://121.46.30.xxx:9443",
LOGIN_ACCOUNT = 'adminningbo',
LOGIN_PWD = 'ningbo2019618';
var session = null;
/*
hdlg: Number
hdlg为打开的视频通道的句柄，唯一标记某个视频窗口。
在打开通道swOpenEx接口的回调中，会通知该句柄。
详见swOpenEx接口参数。在多打开的情况中，对视频窗口的操作都需要填入该句柄。
所以您需要保存该句柄值，并在调用接口时填入。
*/
var hdlg = null;
function testLogin() {
if (session) { delete session; }
session = new jSW.SWSession({
server: LOGIN_SERVER, // 如果是jSW.CallProtoType.OCX方式，这里需要填写具体的IP
port: LOGIN_PORT,
onopen: function (sess) {
sess.swLogin({
user: LOGIN_ACCOUNT,
password: LOGIN_PWD
});
}
});
// 注册事件的回调函数
session.swAddCallBack('login', sessionCallback);
session.swAddCallBack('logout', sessionCallback);
}
function testLogout() {
if (session) {
session.swLogout();
}
}
// 显示设备列表信息
function testShowPuList() {
if (session) {
console.log("session", session);
var msg = '<ul>';
var pulist = session._arr_pu;
console.log("pulist", typeof pulist, pulist)
for (var i = 0; i < pulist.length; i++) {
var pu = pulist;
// console.log("pu", pu)
var puinfo = pu._info_pu;
msg += '<li><font color="red">id:' + puinfo.id + '</font></li>'
+ '<li>name:' + puinfo.name + '</li>'
+ '<li>onlinestatus:' + puinfo.onlinestatus + '</li>'
+ '<li>bootduration:' + puinfo.bootduration + '</li>';
msg += '<li>video chanel:</li><ul>';
var videolist = pu._arr_channel;
for (var j = 0; j < videolist.length; j++) {
var video = videolist[j];
var videoinfo = video._info_chanel;
msg += '<li>id:' + videoinfo.id
+ ' name:' + videoinfo.name
+ ' status:' + videoinfo.status
+ ' ptz:' + videoinfo.ptz + '</li>';
}
msg += '</ul>';
msg += '<li>gps chanel:</li><ul>';
var videolist = pu._arr_gps;
for (var j = 0; j < videolist.length; j++) {
var video = videolist[j];
var videoinfo = video._info_chanel;
msg += '<li>id:' + videoinfo.id
+ ' name:' + videoinfo.name + '</li>';
}
msg += '</ul><br/>';
}
document.getElementById('msg').innerHTML = msg + '</ul>';
}
}
function getPuList() {
if (session) {
var pulist = session._arr_pu;
var pu = pulist["0"];
// console.log("session",session)
console.log("pulist", typeof pulist, pulist)
console.log("pu", typeof pu, pu);
// 默认播放第一个
var puinfo = pu._info_pu;
var puId = puinfo.id;
var videolist = pu._arr_channel;
var video = videolist[0];
var videoinfo = video._info_chanel;
var chanelId = videoinfo.id;
console.log("puId:", puId);
console.log("chanelId:", chanelId);
return {
puId: puId,
chanelId: chanelId
}
}
}
function sessionCallback(sender, event, json) {
var info = '';
if ('login' == event) {
info += '登录';
} else if ('logout' == event) {
info += '退出';
}
if (json.code == jSW.RcCode.RC_CODE_S_OK) {
info += '成功';
// 成功之后获取播放列表并播放视频
// 立即执行获取不到session._arr_pu;
setTimeout(function () {
var playInfo = getPuList();
console.log(playInfo);
testOpenVideo(playInfo.puId, playInfo.chanelId)
}, 500)
} else {
info += '失败, error code: ' + json.code;
}
document.getElementById('msg').innerHTML = info + '<br/><textarea rows="18" cols="100" readonly="readonly"> ' + JSON.stringify(json, null, 4) + '</textarea>';
}
function testOpenVideo(puId = "PU_10150", chanelId = 0) {
var chanel = session.swGetPuChanel(puId, chanelId);
console.log("chanel", chanel)
var strVideoDivId = document.getElementById('id_JustUrl_NoPlay').checked == true ? null : 'id_video';
if (chanel) {
var result = chanel.swOpenEx({
div: strVideoDivId,
prototype: 'auto', //rtmp > hls
callback: function (options, response, dlghandle) {
// alert(response.emms.code + "视频打开成功，可以获取URl了");
console.log(response.emms.code + "视频打开成功，可以获取URl了");
console.log("options", options);
console.log("response", response);
console.log("dlghandle", dlghandle);
hdlg = dlghandle.hdlg;
document.getElementById('id_GetUrl_Button').disabled = 'false';
}
});
if (result != jSW.RcCode.RC_CODE_S_OK) {
alert('打开视频失败: ' + result);
document.getElementById('id_GetUrl_Button').disabled = 'true';
}
} else {
alert('没有该设备通道');
}
}
function testCloseVideo() {
var szpuid = 'PU_10150';
var channelindex = 0;
var chanel = session.swGetPuChanel(szpuid, channelindex);
var result = chanel.swClose();
if (result != jSW.RcCode.RC_CODE_S_OK) {
alert('关闭视频失败: ' + result);
}
}
// 指定dom元素进入全屏模式
function launchFullscreen(element) {
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen();
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullScreen();
}
}
function testFullScreen() {
var szpuid = 'PU_10150';
var channelindex = 0;
var chanel = session.swGetPuChanel(szpuid, channelindex);
var result = chanel.swFullScreen(hdlg);
if (result != jSW.RcCode.RC_CODE_S_OK) {
alert('全频失败: ' + result);
}
}
function testGetUrlVideo() {
var chanel = session.swGetPuChanel('PU_55AA0000', 0);
var url = chanel.swGetUrl();
document.getElementById('id_url_info').innerHTML = JSON.stringify(url, null, 4);
}
window.onload = function () {
jSW.swInit({
url: SWINIT_URL, // bv_nginx.exe服务器地址
calltype: jSW.CallProtoType.AUTO, // AUTO: IE优先使用OCX, 如果希望IE仍然使用HTTP通信, 请使用jSW.CallProtoType.HTTP
oninit: testLogin
});
}
window.onbeforeunload = function () {
jSW.swDeInit();
}
</script>
请问有相关的视频引入示例吗，对前端也不是很了解，参照你们的示例我们这边这样引入，会报Websocket connection to‘ws://121.46.30.xxx:9443/jswapi' failed:Error during WebSorcket handshake :xxxxxx,Unexpected responses code:400 等错误 |
|
poston 2019-9-3 15:22
favor
poston 2019-9-3 16:16
Owner
多问一下，我那个版本的web_api_nginx也就是说原本支持https方式访问。就我那张帖子里视频接入的图片来说。代码引入地址 src 和 url 都换成对应的https:服务器地址:9443,还是说只换播放视频的url地址，原本代码引入的http:127.0.0.1:8081/js/jsw.js不变