WebRTC File Sharing using SCTP Data Channels / Demo
This WebRTC Experiment is using SCTP-based data channels to share files across browsers (chrome & firefox).
A reusable "standalone" library that can be used in any WebRTC or non-WebRTC application to share files.
// https://www.webrtc-experiment.com/File.js
var progressHelper = {};
var outputPanel = document.body;
var fileHelper = {
onBegin: function (file) {
var div = document.createElement('div');
div.title = file.name;
div.innerHTML = '<label>0%</label> <progress></progress>';
outputPanel.insertBefore(div, outputPanel.firstChild);
progressHelper[file.uuid] = {
div: div,
progress: div.querySelector('progress'),
label: div.querySelector('label')
};
progressHelper[file.uuid].progress.max = file.maxChunks;
},
onEnd: function (file) {
progressHelper[file.uuid].div.innerHTML = '<a href="' + file.url + '" target="_blank" download="' + file.name + '"<' + file.name + '</a>';
},
onProgress: function (chunk) {
var helper = progressHelper[chunk.uuid];
helper.progress.value = chunk.currentPosition || chunk.maxChunks || helper.progress.max;
updateLabel(helper.progress, helper.label);
}
};
function updateLabel(progress, label) {
if (progress.position == -1) return;
var position = +progress.position.toFixed(2).split('.')[1] || 100;
label.innerHTML = position + '%';
}
// To Send a File
File.Send({
file: file,
channel: peer,
interval: 100,
chunkSize: 1000, // 1000 for RTP; or 16k for SCTP
// chrome's sending limit is 64k; firefox' receiving limit is 16k!
onBegin: fileHelper.onBegin,
onEnd: fileHelper.onEnd,
onProgress: fileHelper.onProgress
});
// To Receive a File
var fleReceiver = new File.Receiver(fileHelper);
peer.onmessage = function (data) {
fleReceiver.receive(data);
};
A reusable "standalone" library that can be used on any webpage to setup WebRTC SCTP connections (in minutes!).
Documentation of this library available here:
https://github.com/muaz-khan/WebRTC-Experiment/tree/master/file-sharing
=
WebRTC WebRTC File Sharing experiment works fine on following web-browsers:
Browser | Support |
---|---|
Firefox | Stable / Aurora / Nightly |
Google Chrome | Stable / Canary / Beta / Dev |
Android | Chrome Beta |
=
WebRTC WebRTC File Sharing experiment is released under MIT licence . Copyright (c) Muaz Khan.