Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/leaysgur/enhanced-datachannel
Wanna `enhance(RTCDataChannel)` for general usage.
https://github.com/leaysgur/enhanced-datachannel
datachannel p2p promise webrtc
Last synced: 24 days ago
JSON representation
Wanna `enhance(RTCDataChannel)` for general usage.
- Host: GitHub
- URL: https://github.com/leaysgur/enhanced-datachannel
- Owner: leaysgur
- License: mit
- Created: 2019-07-10T06:38:53.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2021-08-01T05:43:23.000Z (over 3 years ago)
- Last Synced: 2024-04-15T07:12:00.416Z (7 months ago)
- Topics: datachannel, p2p, promise, webrtc
- Language: JavaScript
- Homepage:
- Size: 112 KB
- Stars: 6
- Watchers: 1
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# enhanced-datachannel
The `enhance(RTCDataChannel)` functions for general usage.
## Install
```
npm i enhanced-datachannel
```
You need to bundle into your app using `webpack`, `rollup`, etc....
## Exports
```js
import { based, promised, chunked } from "enhanced-datachannel";
const pc = new RTCPeerConnection();
// create DataChannel instance
const dc = pc.createDataChannel("mych");
// or
pc.addEventListener("datachannel", ev => {
const dc = ev.channel;
});
// signaling by yourself and connect p2p...
// enhance it for your usage!
const basedDC = based(dc);
// or
const promisedDC = promised(dc);
// or
const chunkedDC = chunked(dc);
```
Passed `RTCDataChannel` instance should be `reliable` and `ordered` mode.
## API
### BasedDataChannel
```js
const basedDC = based(dc);
```
Do nothing, just wrap with `EventEmitter`.
This class has the same properties which `RTCDataChannel` instance has.
- `readyState`
- `label`
- `binaryType`
- etc...
See [spec](https://w3c.github.io/webrtc-pc/#rtcdatachannel) for the detail.
and also emits the same event types via `EventEmitter`.
- `open`
- `close`
- `error`
- `message`
- `bufferedamountlow`
The `send()` method is equivalent to `dc.send()` and `on("message")` handler is equivalent to `dc.onmessage`.
```js
// recv
basedDC.on("message", data => {});
// send
basedDC.send(data);
```
### PromisedDataChannel
```js
const promisedDC = promised(dc);
```
Make it possible to `await dc.send(json)`.
This class extends `BasedDataChannel`.
And this class has special `send()` method and `on("message")` handler.
```js
// recv
promisedDC.on("message", (data, resolve, reject) => {
try {
console.log(data.msg); // "Take this!"
resolve({ res: "Thank you!" });
} catch (err) {
reject(err);
}
});
// send
const data = await promisedDC.send({ msg: "Take this!" });
console.log(data.res); // "Thank you!"
```
If recv side does not `resolve()` neither nor `reject()`, it is treated as `reject()` with timeout.
### ChunkedDataChannel
```js
const chunkedDC = chunked(dc);
```
Make it possible to send a large file.
This class extends `BasedDataChannel`.
And this class has special `send()` method and `on("message")` handler.
```js
// recv
chunkedDC.on("message", (blob, meta) => {
// download it
const $downloadLink = document.createElement("a");
$downloadLink.href = URL.createObjectURL(blob);
$downloadLink.download = meta.name;
$downloadLink.textContent = meta.name;
document.body.append($downloadLink);
});
// send
await chunkedDC.send(file, { name: "prof.png" });
```