描述:
文档提供web端实现通话示例
开启通话前需要检查是否已经安装h5插件:

状态码说明:

常量标识    错误码值    说明
    -1    正在异步处理中
PG_ERR_Normal           0    成功
PG_ERR_System           1    系统错误
PG_ERR_BadParam         2    参数错误
PG_ERR_BadClass         3    无效的功能类
PG_ERR_BadMethod        4    无效的方法
PG_ERR_BadObject        5    无效的对象
PG_ERR_BadStatus        6    错误的状态
PG_ERR_BadFile          7    无效的文件
PG_ERR_BadUser          8    无效的用户
PG_ERR_BadPass          9    密码错误
PG_ERR_NoLogin          10    未登录
PG_ERR_Network          11    网络错误
PG_ERR_Timeout          12    操作超时
PG_ERR_Reject           13    拒绝访问
PG_ERR_Busy             14    系统正忙
PG_ERR_Opened           15    资源已经打开
PG_ERR_Closed           16    资源已经关闭
PG_ERR_Exist            17    资源已经存在
PG_ERR_NoExist          18    资源不存在
PG_ERR_NoSpace          19    空间或容量限制
PG_ERR_BadType          20    无效的类型
PG_ERR_CheckErr         21    校验错误
PG_ERR_BadServer        22    无效的服务器
PG_ERR_BadDomain        23    无效的域
PG_ERR_NoData           24    没有数据
PG_ERR_Unknown          255    未知错误

SDK:

htmlduijiang.js
htmlduijiangRender.js
htmduijiangerror.js

初始化

 liveObj = new pgLibLiveMultiRender(JSNode, pgLiveUI);
 p2pObj = liveObj.Initialize(paramConfig.sUser, paramConfig.sPass, paramConfig.sSvrAddr, paramConfig.sRelayAddr, paramConfig.iP2PTryTime, paramConfig.sInitParam);

SDK主要函数

var sCapID = account,//对讲房间号
iVideoID = 0,
iAudioID = 0,
sParam = '(OutRotate){0}(OutMirror){1}',
sAudio = '(MuteInput){0}(MuteOutput){0}',
sViewDiv = 'video-grid';//对讲DIV

liveObj.Connect(sCapID);
liveObj.VideoModeSize(1, 100, 100);
liveObj.VideoStart(sCapID, iVideoID, sParam, sViewDiv);
liveObj.AudioStart(sCapID, iAudioID, sAudio)

录像:
liveObj.RecordStart(sCapID, sAviPath, iVideoID, iAudioID);
liveObj.RecordStop(sCapID);

WebSocket处理
1、建立websokcet连接

    var  socket = new WebSocket("wss://webrtc.szymzh.com:9898/ws");

2、WebSocket回调处理

  `socket.onmessage = function (event) {
            var ta = document.getElementById('responseText');
            ta.value += event.data + "\r\n";
            obj = JSON.parse(event.data);
            var actionType = obj["actionType"];


            if (actionType == "login") {
                ta.value += "登录服务器成功!";
            } else if (actionType == "pullData") {


                var sessionId = obj["sessionId"];
                var terminalId = obj["terminalId"];
                var sessionPullMsg = JSON.parse(obj["sessionPullMsg"]);
                var action = sessionPullMsg["action"];
                var terminalNo = sessionPullMsg["terminalNo"];

                var sessionMsg = '{"relust" : "1","msg":"收到对讲请求"}';

                var relustMsg = {};
                relustMsg['sessionId'] = sessionId;
                relustMsg['actionType'] = actionType;
                relustMsg['terminalId'] = terminalId;
                relustMsg['sessionMsg'] = sessionMsg;


                send(JSON.stringify(relustMsg));


                    switch (action) {
                        case "startIntercom":
                            ta.value += "收到对讲请求,机器人编号为--" + terminalNo + ",请输入对讲账号接听";
                            $("#terminalNo").val(terminalNo);
                            break;
                        case "stopIntercom":
                            ta.value += "收到关闭对讲请求,机器人编号为--" + terminalNo + "";
                            $("#video-grid").html("");
                            break;

                    }

            }
        };
        socket.onopen = function (event) {
            var ta = document.getElementById('responseText');
            ta.value = "WebSocket服务器连接成功!  \r\n";
        };
        socket.onclose = function (event) {
            var ta = document.getElementById('responseText');
            ta.value = "WebSocket服务器。。。。。。关闭 \r\n";

        };

开启通话

 function PPTTalk(account, pwd, ppsvraddr) {
            //$.getScript("/Static/pghtml/js/htmduijiangerror.js");
            //$.getScript("/Static/pghtml/htmlduijiang.js");
            //$.getScript("/Static/pghtml/js/htmlduijiangRender.js");
            sUser1 = account;
            var paramConfig = {
                sUser: account,
                sPass: pwd,
                sSvrAddr: ppsvraddr,
                sRelayAddr: '',
                iP2PTryTime: 1,
                sInitParam: '(BufSize2){2048}(Debug){1}'
            }

            var sCapID = account,
                iVideoID = 0,
                iAudioID = 0,
                sParam = '(OutRotate){0}(OutMirror){1}',
                sAudio = '(MuteInput){0}(MuteOutput){0}',
                sViewDiv = 'video-grid';

            var SessionID = 32111;
            JSNode = pgNewJSNode(SessionID);

            var pgLiveUI = {
                OnEvent: function (sAct, sData, sRender) {

                    if (sAct == "Notify") {

                        console.log(sData);
                    }
                    else if (sAct == "Login") {
                        if (sData == "0") {

                            liveObj.Connect(sCapID);

                            liveObj.VideoModeSize(1, 100, 100);

                            liveObj.VideoStart(sCapID, iVideoID, sParam, sViewDiv);

                            liveObj.AudioStart(sCapID, iAudioID, sAudio)
                        }
                        else {
                            parent.layer.msg("登录失败: " + sData);
                        }
                    }
                    else if (sAct == "Logout") {
                        parent.layer.msg("已经注销");
                    }
                    else if (sAct == "Connect") {

                    }
                    else if (sAct == "Disconnect") {
                        parent.layer.msg("已经断开采集端");
                    }
                    else if (sAct == "Reject") {
                        parent.layer.msg("采集端主动拒绝连接");
                    }
                    else if (sAct == "Offline") {
                        parent.layer.msg("采集端不在线");
                    }
                }
            }


            liveObj = new pgLibLiveMultiRender(JSNode, pgLiveUI);


            p2pObj = liveObj.Initialize(paramConfig.sUser, paramConfig.sPass, paramConfig.sSvrAddr, paramConfig.sRelayAddr, paramConfig.iP2PTryTime, paramConfig.sInitParam);

        }

实现代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Websocket</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="~/js/jquery-3.1.1.min.js"></script>
    <script src="~/Static/pghtml/js/htmduijiangerror.js"></script>
    <script src="~/Static/pghtml/htmlduijiang.js"></script>
    <script src="~/Static/pghtml/js/htmlduijiangRender.js"></script>
    <script type="text/javascript">
        var socket;
        if (!window.WebSocket) {
            window.WebSocket = window.MozWebSocket;
        }
        if (window.WebSocket) {
            socket = new WebSocket("wss://webrtc.szymzh.com:9898/ws");//视频对讲服务
            socket.onmessage = function (event) {
                var ta = document.getElementById('responseText');
                ta.value += event.data + "\r\n";
                obj = JSON.parse(event.data);
                var actionType = obj["actionType"];


                if (actionType == "login") {
                    ta.value += "登录服务器成功!";
                } else if (actionType == "pullData") {


                    var sessionId = obj["sessionId"];
                    var terminalId = obj["terminalId"];
                    var sessionPullMsg = JSON.parse(obj["sessionPullMsg"]);
                    var action = sessionPullMsg["action"];
                    var terminalNo = sessionPullMsg["terminalNo"];

                    var sessionMsg = '{"relust" : "1","msg":"收到对讲请求"}';

                    var relustMsg = {};
                    relustMsg['sessionId'] = sessionId;
                    relustMsg['actionType'] = actionType;
                    relustMsg['terminalId'] = terminalId;
                    relustMsg['sessionMsg'] = sessionMsg;


                    send(JSON.stringify(relustMsg));


                        switch (action) {
                            case "startIntercom":
                                ta.value += "收到对讲请求,机器人编号为--" + terminalNo + ",请输入对讲账号接听";
                                $("#terminalNo").val(terminalNo);
                                break;
                            case "stopIntercom":
                                ta.value += "收到关闭对讲请求,机器人编号为--" + terminalNo + "";
                                $("#video-grid").html("");
                                break;

                        }

                }
            };
            socket.onopen = function (event) {
                var ta = document.getElementById('responseText');
                ta.value = "WebSocket服务器连接成功!  \r\n";
            };
            socket.onclose = function (event) {
                var ta = document.getElementById('responseText');
                ta.value = "WebSocket服务器。。。。。。关闭 \r\n";

            };
        } else {
            alert("您的浏览器不支持WebSocket协议!");
        }
        function send(message) {
            if (!window.WebSocket) { return; }
            if ('WebSocket' in window) {
                ws = new WebSocket("wss://webrtc.szymzh.com:9898/ws");
            } else {
                console.error("WebSocket连接没有建立成功!");
                return;
            }
            if (socket.readyState == WebSocket.OPEN) {
                socket.send(message);
            } else {
                alert("WebSocket 连接没有建立成功!");
            }
        }

        function sendLogin() {
            if (!window.WebSocket) { return; }
            if (socket.readyState == WebSocket.OPEN) {
                var message = "{\"actionType\":\"login\",\"terminalId\":\"admin\"}";
                socket.send(message);

                var sendMessagevar = document.getElementById("sendMessage");
                sendMessagevar.innerHTML = message;

            } else {
                alert("WebSocket 连接没有建立成功!");
            }
        }

        var JSNode = null;
        var liveObj = null;
        var p2pObj = null;
        var sUser1 = "";
        function PPTTalk(account, pwd, ppsvraddr) {
            //$.getScript("/Static/pghtml/js/htmduijiangerror.js");
            //$.getScript("/Static/pghtml/htmlduijiang.js");
            //$.getScript("/Static/pghtml/js/htmlduijiangRender.js");
            sUser1 = account;
            var paramConfig = {
                sUser: account,
                sPass: pwd,
                sSvrAddr: ppsvraddr,
                sRelayAddr: '',
                iP2PTryTime: 1,
                sInitParam: '(BufSize2){2048}(Debug){1}'
            }

            var sCapID = account,
                iVideoID = 0,
                iAudioID = 0,
                sParam = '(OutRotate){0}(OutMirror){1}',
                sAudio = '(MuteInput){0}(MuteOutput){0}',
                sViewDiv = 'video-grid';

            var SessionID = 32111;
            JSNode = pgNewJSNode(SessionID);

            var pgLiveUI = {
                OnEvent: function (sAct, sData, sRender) {

                    if (sAct == "Notify") {

                        console.log(sData);
                    }
                    else if (sAct == "Login") {
                        if (sData == "0") {

                            liveObj.Connect(sCapID);

                            liveObj.VideoModeSize(1, 100, 100);

                            liveObj.VideoStart(sCapID, iVideoID, sParam, sViewDiv);

                            liveObj.AudioStart(sCapID, iAudioID, sAudio)
                        }
                        else {
                            parent.layer.msg("登录失败: " + sData);
                        }
                    }
                    else if (sAct == "Logout") {
                        parent.layer.msg("已经注销");
                    }
                    else if (sAct == "Connect") {

                    }
                    else if (sAct == "Disconnect") {
                        parent.layer.msg("已经断开采集端");
                    }
                    else if (sAct == "Reject") {
                        parent.layer.msg("采集端主动拒绝连接");
                    }
                    else if (sAct == "Offline") {
                        parent.layer.msg("采集端不在线");
                    }
                }
            }


            liveObj = new pgLibLiveMultiRender(JSNode, pgLiveUI);


            p2pObj = liveObj.Initialize(paramConfig.sUser, paramConfig.sPass, paramConfig.sSvrAddr, paramConfig.sRelayAddr, paramConfig.iP2PTryTime, paramConfig.sInitParam);

        }

        function trtcAnswer() {
            var ta = document.getElementById('responseText');
            $.getJSON("/Index/ReceiveTalking", { terminalNo: $("#terminalNo").val(), account: "ym0001", pwd: "123456" }, function (json) {
                if (json.Success) {
                    ta.value += "下发[" + $("#terminalNo").val() + "]房间成功";
                    PPTTalk(json.Data.account, json.Data.pwd, json.Data.ppsvraddr);
                } else {

                }
            });
        }

        function closeTalk() {
            //调用SDK关闭
             $("#video-grid").html("");
             liveObj.Disconnect(sCapID);
            liveObj.Clean();
            //调用接口关闭
            var ta = document.getElementById('responseText');
            $.getJSON("/Index/OnlineCloseTalking", { terminalNo: $("#terminalNo").val() }, function (json) {
                if (json.Success) {
                    ta.value += "下发[" + $("#terminalNo").val() + "]关闭房间成功";
                    $("#video-grid").html("");
                } else {
                    console.log(json.Message);
                }
            });
        }

    </script>
</head>

<body>
    <form onSubmit="return false;">
        <h3>发送消息</h3>
        <textarea id="sendMessage" style="width: 1024px;height: 100px;"></textarea>

        <hr color="black" />
        <br /> <input type="button" value="发送ws消息"
                      onClick="send(this.form.sendMessage.value)" />
        <input type="button" value="登录websocket" onClick="sendLogin()" />
        @*<input type="button" value="发送ws消息"
               onClick="send(this.form.sendMessage.value)" />*@
        <br />
        <input type="button" value="接听对讲" onClick="trtcAnswer()" />
        设备编号<input type="text" id="terminalNo" />
        对讲账号<input type="text" id="account" value="ym0001" />
        密码<input type="text" id="pwd" value="123456" />
        <input type="button" value="关闭对讲" onClick="closeTalk()" />
        <hr color="black" />
        <h3>服务端返回的应答消息</h3>
        <textarea id="responseText" style="width: 1024px;height: 300px;"></textarea>
    </form>
    <div id="video-grid" style="width:300px;height:300px;"></div>
</body>
</html>
作者:郭祥西  创建时间:2024-04-10 17:32
最后编辑:郭祥西  更新时间:2024-11-07 15:18