Giter VIP home page Giter VIP logo

peertc's Introduction

Peertc

##简介 Peertc用于在浏览器之间通过WebRTC建立点对点的通信,并提供文件传输、消息传输和视频、音频通信

todo:图片传输

##示例 使用如下命令启动demo服务器:

$ git clone [email protected]:LingyuCoder/peertc.git
$ npm install
$ node server.js

开启两个页面分别访问http://localhost:2999,并在注册框中填入不同的id,然后在一个页面的连接框中填入另外一个页面的id,点击“连接”后即可相互发送文件和消息

##使用 ###注册 Peertc希望能够通过简单的语句来创建点对点的信道。首先需要向服务器进行注册:

var peertc = Peertc('ws://localhost:2999', 'user1');

完成后,用户将以user1为id在服务器上注册,使用同样的方式注册user2。

###连接 通过简单的命令即可建立user1与user2之间的连接:

//user1
var connector = peertc.connect('user2');
peertc.on('open', function(id){
    //连接建立后的逻辑
}).on('close', function(id){
    //连接关闭后的逻辑
});

通过connect建立连接会返回一个connector,用于发送文件和消息

###发送消息 ####发送 peertc强调的是简单,所以发送消息使用如下命令即可:

connector.send({
    data: 'hahahahahaha',
    type: 'laugh'
});

####链式发送 可以链式的发送消息:

connector.send('Hello ').send('world');

####监听 通过在peertc上监听message事件即可监听所有到来的消息:

peertc.on('message', function(data, from){
    //data为消息内容,from为发送者的id
});

###发送文件 ####发送 发送文件与发送消息基本相同,不同的是传入的参数是一个file类型的input节点:

connector.sendFile(dom1).sendFile(dom2);

####监听 文件发送会分片,所以提供了fileChunk和file两个事件来分别监听文件碎片和完整文件:

peertc.on('fileChunk', function(data, from){
    //data: 碎片信息
    //  meta: 文件基本信息
    //      name: 文件名
    //      size: 文件大小
    //      type: 文件类型
    //  chunk: 碎片内容
    //  sum: 须传输的总大小
    //  sended: 已传输的大小
    //  id: 每一次传输的特有id

    //from: 发送者的id
}).on('file', function(meta, from){
    //meta: 同上meta
    //from: 发送者的id
});

文件发送完成后会自动下载

###错误处理 通过如下方式可以监听错误:

peertc.on('error', function(err){
    //err为错误对象
});

##自动退化 在支持WebRTC DataChannel的浏览器(chrome,firefox,opera)中,使用DataChannel,否则将退化使用websocket替代。

##视频、音频聊天 ###发送 通过如下addStream即可开启视频、音频聊天:

connector.addStream({
    video: true,//是否开启视频
    audio: true//是否开启音频
});

###中止视频 通过removeStream方法能够停止视频聊天,并触发removeStream事件

connector.removeStream();

###监听视频事件 通过如下方式来监听视频、音频流的事件:

peertc.on('stream', function(stream, from){
    //stream : 流对象,提供了一个attachTo方法用来绑定到一个video元素上
    //from: 流的来源用户id
    stream.attachTo(document.getElementById('otherVideo'));
}).on('localStream', function(stream){
    //stream:本地视频流对象,提供了一个attachTo方法用来绑定到一个video元素上
    stream.attachTo(document.getElementById('selfVideo'));
}).on('removeStream', function(from){
    //from: 关闭视频通信的用户id
});

###兼容性 若浏览器不兼容WebRTC Datachannel,数据将通过WebSocket传输,将无法开启视频、音频通信

##依赖 依赖peertc,已上传到npm上

##协议 MIT

peertc's People

Contributors

lingyucoder avatar

Watchers

James Cloos avatar hugehard avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.