SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析

這篇具有很好參考價值的文章主要介紹了SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方，請大家不吝賜教，您也可以點擊"舉報違法"按鈕提交疑問。

環(huán)境搭建

1. 安裝go語?環(huán)境

在Go語?官?找到對應的安裝包（Downloads - The Go Programming Language）
下載和解析（使用的是阿里云的Ubuntu系統(tǒng)）：

cd /usr/local/
wget https://dl.google.com/go/go1.16.5.linux-amd64.tar.gz --no-check-certificate
tar -C /usr/local -xzf go1.16.5.linux-amd64.tar.gz

3.需要配置 GOROOT 和 PATH環(huán)境變量，在/etc/profile中配置。

vim /etc/profile

# 將環(huán)境變量添加到/etc/profile?件末尾。
export GOROOT=/usr/local/go
export PATH=$PATH:$GOROOT/bin:$GOBIN

4.然后使用 source /etc/profile 命令使配置文件生效，就可以在任意?錄使用Go語言命令。

source /etc/profile

5.執(zhí)行g(shù)o version可以查看安裝go是否成功。

2. 編譯和啟動srs

git clone -b v4.0.123 https://gitee.com/winlinvip/srs.oschina.git
srs.4.0.123
cd srs.4.0.123/trunk
./configure
make
./objs/srs -c conf/rtc.conf

3. 編譯和啟動信令服務器

cd 3rdparty/signaling
make
./objs/signaling

SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析 ?注意：云服務器需要先開通1989端口。

本文福利，免費領(lǐng)取C++音視頻學習資料包、技術(shù)視頻，內(nèi)容包括（音視頻開發(fā)，面試題，F(xiàn)Fmpeg ，webRTC ，rtmp ，hls ，rtsp ，ffplay ，編解碼，推拉流，srs）↓↓↓↓↓↓見下面↓↓文章底部點擊免費領(lǐng)取↓↓

4. 編譯和啟動web服務器

需要server.crt和server.key，如果沒有則?openssl?成。
進入srs/trunk/3rdparty/httpx-static目錄，執(zhí)行：

# ?成 server.key
openssl genrsa -out server.key 2048

# ?成 server.crt
openssl req -new -x509 -key server.key -out server.crt -days 3650

?3.編譯和啟動web服務器

cd 3rdparty/httpx-static
make
./objs/httpx-static -http 80 -https 443 -ssk server.key -ssc server.crt \
-proxy http://127.0.0.1:1989/sig -proxy http://127.0.0.1:1985/rtc \
-proxy http://127.0.0.1:8080/

SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析

5. 進入測試頁面

打開demo地址：

https://localhost/demos/
https://192.xxx.3.6/demos/  #公網(wǎng)ip

SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析

2.輸入Room和Display就可以進行1對1通話。
SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析

3. SRS4.0 WebRTC1對1通話邏輯分析
按f12打開一對一通話http頁面源碼，在 one2one.html?autostart=true&room=fbe219e 中可以看到，“開始通話”按鈕id是btn_start，當點擊按鈕后，執(zhí)行startDemo函數(shù)。
startDemo函數(shù)如下：

        var startDemo = async function () {
            var host = $('#txt_host').val(); //獲取ip或者域名，房間id，參與者名字
            var room = $('#txt_room').val();
            var display = $('#txt_display').val();

            // Connect to signaling first. //關(guān)閉先前的websock連接
            if (sig) {
                sig.close(); //見srs.sig.js close部分
            }
            sig = new SrsRtcSignalingAsync(); //創(chuàng)建SrsRtcSignalingAsync，RTC信令
            sig.onmessage = function (msg) { //onmessage訂閱新的信令消息
                console.log('Notify: ', msg);

                if (msg.event === 'leave') {
                    $('#player').hide();
                }

                if (msg.event === 'publish') { //房間已經(jīng)存在的參與者，收到publish信令后再去訂閱新加入者
                    if (msg.peer && msg.peer.publishing && msg.peer.display !== display) {
                        startPlay(host, room, msg.peer.display);
                    }
                }

                if (msg.event === 'control') {
                    if (msg.param === 'refresh') {
                        setTimeout(function () {
                            window.location.reload();
                        }, 500);
                    } else if (msg.param === 'alert') {
                        alert('From ' + msg.peer.display + ': ' + msg.data);
                    }
                }

                if (msg.participants.length >= 2) {
                    $('.srs_merge').show();
                } else {
                    $('.srs_merge').hide();
                }
            };
            await sig.connect(conf.wsSchema, conf.wsHost, room, display); //連接websock，見下面SrsRtcSignalingAsync代碼

            control_refresh_peer = async function () {
                let r1 = await sig.send({action:'control', room:room, display:display, call:'refresh'});
                console.log('Signaling: control peer to refresh ok', r1);
            };
            control_alert_peer = async function () {
                let r1 = await sig.send({action:'control', room:room, display:display, call:'alert', data:$('#txt_alert').val()});
                console.log('Signaling: control peer to alert ok', r1);
            };

            let r0 = await sig.send({action:'join', room:room, display:display}); //向信令服務器發(fā)送join信令，會返回房間列表，包括當前房間id，房間人數(shù)和每個display的名字和是否推流，見下圖。
            console.log('Signaling: join ok', r0);

            // For one to one demo, alert and ignore when room is full. 判斷房間人數(shù)是否超過2個，因為是1v1場景
            if (r0.participants.length > 2) {
                alert('Room is full, already ' + (r0.participants.length - 1) + ' participants');
                sig.close();
                return;
            }

            // Start publish media if signaling is ok.
            await startPublish(host, room, display); //向srs流媒體服務器開始推流，代碼見下面
            let r1 = await sig.send({action:'publish', room:room, display:display}); //向信令服務器發(fā)送publish信令
            console.log('Signaling: publish ok', r1);

            // Play the stream already in room. 對于新建的房間，會拉取房間內(nèi)另一個人的流
            r0.participants.forEach(function(participant) {
                if (participant.display === display || !participant.publishing) return;
                startPlay(host, room, participant.display); //向srs流媒體拉房間內(nèi)另一個人的流
            });

            if (r0.participants.length >= 2) {
                $('.srs_merge').show();
            }
        };

2.SrsRtcSignalingAsync代碼：

// Async-await-promise based SRS RTC Signaling.
function SrsRtcSignalingAsync() {
    var self = {};

    // The schema is ws or wss, host is ip or ip:port, display is nickname
    // of user to join the room.
    self.connect = async function (schema, host, room, display) {
        var url = schema + '://' + host + '/sig/v1/rtc'; //如：wss://8.xxx.75.248/sig/v1/rtc
        self.ws = new WebSocket(url + '?room=' + room + '&display=' + display); //建立websock連接，地址為：wss://8.xxx.75.248/sig/v1/rtc?room=123&display=zhangsan

        self.ws.onmessage = function(event) {
            var r = JSON.parse(event.data);
            var promise = self._internals.msgs[r.tid];
            if (promise) {
                promise.resolve(r.msg);
                delete self._internals.msgs[r.tid];
            } else {
                self.onmessage(r.msg);
            }
        };

        return new Promise(function (resolve, reject) {
            self.ws.onopen = function (event) {
                resolve(event);
            };

            self.ws.onerror = function (event) {
                reject(event);
            };
        });
    };

    // The message is a json object.
    self.send = async function (message) {
        return new Promise(function (resolve, reject) {
            var r = {tid: Number(parseInt(new Date().getTime()*Math.random()*100)).toString(16).substr(0, 7), msg: message};
            self._internals.msgs[r.tid] = {resolve: resolve, reject: reject};
            self.ws.send(JSON.stringify(r));
        });
    };

    self.close = function () {
        self.ws && self.ws.close();
        self.ws = null;

        for (const tid in self._internals.msgs) {
            var promise = self._internals.msgs[tid];
            promise.reject('close');
        }
    };

    // The callback when got messages from signaling server.
    self.onmessage = function (msg) {
    };

    self._internals = {
        // Key is tid, value is object {resolve, reject, response}.
        msgs: {}
    };

    return self;
}

3.join信息返回信息。
SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析

4.startPublish和startPlay代碼。

       var startPublish = function (host, room, display) {
            $(".ff_first").each(function(i,e) {
                $(e).text(display);
            });

            var url = 'webrtc://' + host + '/' + room + '/' + display + conf.query; //如： webrtc://8.xxx.75.248/123/wangwu
            $('#rtc_media_publisher').show();
            $('#publisher').show();

            if (publisher) {
                publisher.close();
            }
            publisher = new SrsRtcPublisherAsync(); //創(chuàng)建RTC異步推流
            $('#rtc_media_publisher').prop('srcObject', publisher.stream);

            return publisher.publish(url).then(function(session){
                $('#self').text('Self: ' + url);
            }).catch(function (reason) {
                publisher.close();
                $('#rtc_media_publisher').hide();
                console.error(reason);
            });
        };

        var startPlay = function (host, room, display) {
            $(".ff_second").each(function(i,e) {
                $(e).text(display);
            });

            var url = 'webrtc://' + host + '/' + room + '/' + display + conf.query; //
            $('#rtc_media_player').show();
            $('#player').show();

            if (player) {
                player.close();
            }

            player = new SrsRtcPlayerAsync();
            $('#rtc_media_player').prop('srcObject', player.stream);

            player.play(url).then(function(session){
                $('#peer').text('Peer: ' + display);
                $('#rtc_media_player').prop('muted', false);
            }).catch(function (reason) {
                player.close();
                $('#rtc_media_player').hide();
                console.error(reason);
            });
        };

本文福利，免費領(lǐng)取C++音視頻學習資料包、技術(shù)視頻，內(nèi)容包括（音視頻開發(fā)，面試題，F(xiàn)Fmpeg ，webRTC ，rtmp ，hls ，rtsp ，ffplay ，編解碼，推拉流，srs）↓↓↓↓↓↓見下面↓↓文章底部點擊免費領(lǐng)取↓↓?文章來源地址http://www.zghlxwxcb.cn/news/detail-403860.html

到了這里，關(guān)于SRS流媒體服務器——SRS4.0 WebRTC一對一通話環(huán)境搭建與邏輯分析的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！