Skip to content

Commit dae2163

Browse files
ValorZardValorZard
committed
slowly hacking my way into this
1 parent 8decbcb commit dae2163

File tree

2 files changed

+25
-104
lines changed

2 files changed

+25
-104
lines changed

‎examples/whip-whep-data-channels/index.html

+24-13
Original file line numberDiff line numberDiff line change
@@ -11,17 +11,30 @@
1111
<body>
1212
<button onclick="window.doWHIP()">Publish</button>
1313
<button onclick="window.doWHEP()">Subscribe</button>
14-
<h3> Video </h3>
15-
<video id="videoPlayer" autoplay muted controls style="width: 500"> </video>
14+
<br />
15+
Message<br />
16+
<textarea id="message">This is my DataChannel message!</textarea> <br/>
17+
<button onclick="window.sendMessage()">Send Message</button> <br />
18+
<h3> Logs </h3>
19+
<div id="logs"></div>
1620

1721

1822
<h3> ICE Connection States </h3>
1923
<div id="iceConnectionStates"></div> <br />
2024
</body>
2125

2226
<script>
27+
const log = msg => {
28+
document.getElementById('logs').innerHTML += msg + '<br>'
29+
}
30+
2331
let peerConnection = new RTCPeerConnection()
2432

33+
const sendChannel = peerConnection.createDataChannel('foo')
34+
sendChannel.onclose = () => console.log('sendChannel has closed')
35+
sendChannel.onopen = () => console.log('sendChannel has opened')
36+
sendChannel.onmessage = e => log(`Message from DataChannel '${sendChannel.label}' payload '${e.data}'`)
37+
2538
peerConnection.oniceconnectionstatechange = () => {
2639
let el = document.createElement('p')
2740
el.appendChild(document.createTextNode(peerConnection.iceConnectionState))
@@ -30,11 +43,6 @@ <h3> ICE Connection States </h3>
3043
}
3144

3245
window.doWHEP = () => {
33-
peerConnection.addTransceiver('video', { direction: 'recvonly' })
34-
35-
peerConnection.ontrack = function (event) {
36-
document.getElementById('videoPlayer').srcObject = event.streams[0]
37-
}
3846

3947
peerConnection.createOffer().then(offer => {
4048
peerConnection.setLocalDescription(offer)
@@ -57,11 +65,6 @@ <h3> ICE Connection States </h3>
5765
}
5866

5967
window.doWHIP = () => {
60-
navigator.mediaDevices.getUserMedia({ video: true, audio: false })
61-
.then(stream => {
62-
document.getElementById('videoPlayer').srcObject = stream
63-
stream.getTracks().forEach(track => peerConnection.addTrack(track, stream))
64-
6568
peerConnection.createOffer().then(offer => {
6669
peerConnection.setLocalDescription(offer)
6770

@@ -80,7 +83,15 @@ <h3> ICE Connection States </h3>
8083
})
8184
})
8285
})
83-
})
86+
}
87+
88+
window.sendMessage = () => {
89+
const message = document.getElementById('message').value
90+
if (message === '') {
91+
return alert('Message must not be empty')
92+
}
93+
94+
sendChannel.send(message)
8495
}
8596
</script>
8697
</html>

‎examples/whip-whep-data-channels/main.go

+1-91
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,11 @@ import (
1313
"io"
1414
"net/http"
1515

16-
"github.com/pion/interceptor"
17-
"github.com/pion/interceptor/pkg/intervalpli"
1816
"github.com/pion/webrtc/v4"
1917
)
2018

2119
// nolint: gochecknoglobals
2220
var (
23-
videoTrack *webrtc.TrackLocalStaticRTP
24-
2521
peerConnectionConfiguration = webrtc.Configuration{
2622
ICEServers: []webrtc.ICEServer{
2723
{
@@ -34,13 +30,6 @@ var (
3430
// nolint:gocognit
3531
func main() {
3632
// Everything below is the Pion WebRTC API! Thanks for using it ❤️.
37-
var err error
38-
if videoTrack, err = webrtc.NewTrackLocalStaticRTP(webrtc.RTPCodecCapability{
39-
MimeType: webrtc.MimeTypeH264,
40-
}, "video", "pion"); err != nil {
41-
panic(err)
42-
}
43-
4433
http.Handle("/", http.FileServer(http.Dir(".")))
4534
http.HandleFunc("/whep", whepHandler)
4635
http.HandleFunc("/whip", whipHandler)
@@ -56,73 +45,12 @@ func whipHandler(res http.ResponseWriter, req *http.Request) {
5645
panic(err)
5746
}
5847

59-
// Create a MediaEngine object to configure the supported codec
60-
mediaEngine := &webrtc.MediaEngine{}
61-
62-
// Setup the codecs you want to use.
63-
// We'll only use H264 but you can also define your own
64-
if err = mediaEngine.RegisterCodec(webrtc.RTPCodecParameters{
65-
RTPCodecCapability: webrtc.RTPCodecCapability{
66-
MimeType: webrtc.MimeTypeH264, ClockRate: 90000, Channels: 0, SDPFmtpLine: "", RTCPFeedback: nil,
67-
},
68-
PayloadType: 96,
69-
}, webrtc.RTPCodecTypeVideo); err != nil {
70-
panic(err)
71-
}
72-
73-
// Create a InterceptorRegistry. This is the user configurable RTP/RTCP Pipeline.
74-
// This provides NACKs, RTCP Reports and other features. If you use `webrtc.NewPeerConnection`
75-
// this is enabled by default. If you are manually managing You MUST create a InterceptorRegistry
76-
// for each PeerConnection.
77-
interceptorRegistry := &interceptor.Registry{}
78-
79-
// Register a intervalpli factory
80-
// This interceptor sends a PLI every 3 seconds. A PLI causes a video keyframe to be generated by the sender.
81-
// This makes our video seekable and more error resilent, but at a cost of lower picture quality and higher bitrates
82-
// A real world application should process incoming RTCP packets from viewers and forward them to senders
83-
intervalPliFactory, err := intervalpli.NewReceiverInterceptor()
84-
if err != nil {
85-
panic(err)
86-
}
87-
interceptorRegistry.Add(intervalPliFactory)
88-
89-
// Use the default set of Interceptors
90-
if err = webrtc.RegisterDefaultInterceptors(mediaEngine, interceptorRegistry); err != nil {
91-
panic(err)
92-
}
93-
94-
// Create the API object with the MediaEngine
95-
api := webrtc.NewAPI(webrtc.WithMediaEngine(mediaEngine), webrtc.WithInterceptorRegistry(interceptorRegistry))
96-
97-
// Prepare the configuration
98-
9948
// Create a new RTCPeerConnection
100-
peerConnection, err := api.NewPeerConnection(peerConnectionConfiguration)
49+
peerConnection, err := webrtc.NewPeerConnection(peerConnectionConfiguration)
10150
if err != nil {
10251
panic(err)
10352
}
10453

105-
// Allow us to receive 1 video trac
106-
if _, err = peerConnection.AddTransceiverFromKind(webrtc.RTPCodecTypeVideo); err != nil {
107-
panic(err)
108-
}
109-
110-
// Set a handler for when a new remote track starts, this handler saves buffers to disk as
111-
// an ivf file, since we could have multiple video tracks we provide a counter.
112-
// In your application this is where you would handle/process video
113-
peerConnection.OnTrack(func(track *webrtc.TrackRemote, receiver *webrtc.RTPReceiver) { //nolint: revive
114-
for {
115-
pkt, _, err := track.ReadRTP()
116-
if err != nil {
117-
panic(err)
118-
}
119-
120-
if err = videoTrack.WriteRTP(pkt); err != nil {
121-
panic(err)
122-
}
123-
}
124-
})
125-
12654
// Send answer via HTTP Response
12755
writeAnswer(res, peerConnection, offer, "/whip")
12856
}
@@ -140,24 +68,6 @@ func whepHandler(res http.ResponseWriter, req *http.Request) {
14068
panic(err)
14169
}
14270

143-
// Add Video Track that is being written to from WHIP Session
144-
rtpSender, err := peerConnection.AddTrack(videoTrack)
145-
if err != nil {
146-
panic(err)
147-
}
148-
149-
// Read incoming RTCP packets
150-
// Before these packets are returned they are processed by interceptors. For things
151-
// like NACK this needs to be called.
152-
go func() {
153-
rtcpBuf := make([]byte, 1500)
154-
for {
155-
if _, _, rtcpErr := rtpSender.Read(rtcpBuf); rtcpErr != nil {
156-
return
157-
}
158-
}
159-
}()
160-
16171
// Send answer via HTTP Response
16272
writeAnswer(res, peerConnection, offer, "/whep")
16373
}

0 commit comments

Comments
 (0)