梦幻般的webrtc

最新推荐文章于 2021-03-21 20:31:10 发布

Z小胖

最新推荐文章于 2021-03-21 20:31:10 发布

阅读量395

点赞数

分类专栏： PHP 文章标签： webrtc 视频直播

本文链接：https://blog.csdn.net/mrtwofly/article/details/53943947

版权

PHP 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

只需一个页面就可以进行视频了要不要是意思？

<!DOCTYPE html>

<html>

<head>

    <script src="https://code.jquery.com/jquery-1.9.1.js"></script>

    <script src="http://simplewebrtc.com/latest.js"></script>

    <script>

 

        var webrtc = new SimpleWebRTC({

            // the id/element dom element that will hold "our" video

            localVideoEl: 'localVideo',

            // the id/element dom element that will hold remote videos

            remoteVideosEl: 'remoteVideos',

            // immediately ask for camera access

            autoRequestMedia: true,

            //url:'http://111.172.238.250:8888'

            nick: 'wuhan'

        });

 

 

 

        // we have to wait until it's ready

        webrtc.on('readyToCall', function () {

            // you can name it anything

            webrtc.joinRoom('room1');

 

            // Send a chat message

            $('#send').click(function () {

                var msg = $('#text').val();

                webrtc.sendToAll('chat', { message: msg, nick: webrtc.config.nick });

                $('#messages').append('<br>You:<br>' + msg + '\n');

                $('#text').val('');

            });

        });

 

        //For Text Chat ------------------------------------------------------------------

        // Await messages from others

        webrtc.connection.on('message', function (data) {

            if (data.type === 'chat') {

                console.log('chat received', data);

                $('#messages').append('<br>' + data.payload.nick + ':<br>' + data.payload.message+ '\n');

            }

        });

        

    </script>

    <style>

        #remoteVideos video {

            height: 150px;

        }

 

        #localVideo {

            height: 150px;

        }

    </style>

</head>

<body>

    <textarea id="messages" rows="5" cols="20"></textarea><br />

    <input id="text" type="text" />

    <input id="send" type="button" value="send" /><br />

    <video id="localVideo"></video>

    <div id="remoteVideos"></div>

</body>

</html>

把上面代码放到HTML页面就可进行视频了

Z小胖

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
梦幻般的webrtc

只需一个页面就可以进行视频了要不要是意思？ var webrtc = new SimpleWebRTC({ // the id/element dom element that will hold "our" video localVideoEl: 'localVideo',
复制链接

扫一扫

专栏目录