GstWebRTC - PubNub Web Pages - x86: Difference between revisions

From RidgeRun Developer Wiki
No edit summary
mNo edit summary
 
(26 intermediate revisions by 5 users not shown)
Line 1: Line 1:
<table>
{{GstWebRTC/Head|previous=Audio + Video Examples - x86|next=AppRTC Signaler Examples - x86|metakeywords=GstWebRTC Examples,WebRTC Examples,GstWebRTC GStreamer pipelines,WebRTC GStreamer pipelines,GstWebRTC PubNub Signaler,WebRTC PubNub Signaler,GstWebRTC PubNub Demo Page,WebRTC PubNub Demo Page,GstWebRTC PubNub GStreamer pipelines,WebRTC PubNub Pipelines,signaling}}
<tr>
<td><div class="clear; float:right">__TOC__</div></td>
<td valign=top>
{{Debug Symbol}} Problems running the pipelines shown on this page?<br>Please see our [http://developer.ridgerun.com/wiki/index.php?title=GStreamer_Debugging GStreamer Debugging guide] for help.
</td>
</table>


{{GstWebRTC Page|
This page shows a series of pipelines to try out the experimental PubNub support on '''x86 platform'''.
[[GstWebRTC - Audio + Video Examples|Audio + Video]]|
<br>
[[GstWebRTC|Home]]|
<br>
 
{{GStreamer debug}}
This page shows a series of pipelines to try out the experimental PubNub support.
 
__TOC__


== PubNub Demo Pages ==
== PubNub Demo Pages ==


PubNub offers a couple of test web pages to try out the WebRTC signalers.  
PubNub offers a few test web pages to try out the WebRTC signalers.
* https://webrtc.ridgerun.com:7443
* http://webrtc.ridgerun.com:7080
* https://kevingleason.me/SimpleRTC/minivid.html
* https://kevingleason.me/SimpleRTC/minivid.html
* https://www.pubnub.com/developers/demos/webrtc/
* https://www.pubnub.com/developers/demos/webrtc/
Line 24: Line 17:
These examples are such that audio+video is required in both ways.
These examples are such that audio+video is required in both ways.
</pre>
</pre>
=== PubNub's WebRTC page ===
WebRTC provides a PubNub page that does not require audio+video streaming in both ways. It allows the selection of sending or receiving (or both): only video, only audio and audio+video.
You can access the PubNub WebRTC page from here https://webrtc.ridgerun.com:7443/.
Also you can access using your localhost like in the following example, the port is defined as 8080:
<syntaxhighlight lang='bash'>
cd gst-webrtc/tests/examples/signalers/pubnub
python3 -m http.server 8080
</syntaxhighlight>
The following show how to establish a call using the PubNub's WebRTC page in https://localhost:8080 (Select the port you defined)
<br>
[[File:pubnub_webpage.png|700px|center|Establish a WebRTC call with https://localhost:8080]]
<br>
# Type a unique name in the top text bar.
# Type the pipeline name in the bottom text bar.
# Select video and audio options: Disable, Send only, Receive only or Send-Receive.
# Select Data: Send-Receive or Disable
# Select Register button.
# Start the call from the pipeline or selecting the call button on the Webpage.
'''Note:''' In the following examples, the start-call property on the pipeline is set to false, thus you have to start the call from the website pressing the correct button. If start-call is set to true, the pipeline starts the call.


=== SimpleRTC WebPage ===
=== SimpleRTC WebPage ===


The following figure show how to establish a call using the SimpleRTC web page in https://kevingleason.me/SimpleRTC/minivid.html
The following figure show how to establish a call using the SimpleRTC web page in https://kevingleason.me/SimpleRTC/minivid.html
 
<br>
[[File:demo-minivid.png|700px|center|Establish a WebRTC call with https://kevingleason.me/SimpleRTC/minivid.html]]
[[File:demo-minivid.png|700px|center|Establish a WebRTC call with https://kevingleason.me/SimpleRTC/minivid.html]]
 
<br>
# Type a unique name in the top text bar.
# Type a unique name in the top text bar.
# Register that unique name to PubNub
# Register that unique name to PubNub
Line 38: Line 55:
=== PubNub Official Demo ===
=== PubNub Official Demo ===


The following figure show how to establish a call using the official PubNub's WebRTC demo in https://www.pubnub.com/developers/demos/webrtc/
The following figure show hows to establish a call using the official PubNub's WebRTC demo in https://www.pubnub.com/developers/demos/webrtc/
<br>
[[File:PubNub_Google_Chrome.png|700px|center|Establish a WebRTC call with https://www.pubnub.com/developers/demos/webrtc/]]
<br>
'''Follow these steps'''
 
# Make sure to type the number above the message "this is your phone number" in the pipeline description
# Just type the pipeline's name in the bottom text bar. In the examples 123 this would be $USER_CHANNEL or 123, don't press any of the other buttons
# Launch the pipeline, the call should start right away (in Chrome), a couple of seconds at most (in Firefox).


[[File:demo-pubnub.png|700px|center|Establish a WebRTC call with https://www.pubnub.com/developers/demos/webrtc/]]
====VP8====


# Type the pipeline's name in the bottom text bar. In the examples 123 this would be $USER_CHANNEL or 123
'''Send/receive (VP8)'''
# Start the call
<pre style="white-space: pre-wrap;">
GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web videotestsrc is-live=true ! "video/x-raw, width=(int)640, height=(int)480, format=(string)I420, framerate=(fraction)30/1" ! vp8enc ! rtpvp8pay ! web.video_sink web.video_src ! rtpvp8depay ! avdec_vp8 ! xvimagesink
</pre>


=== PubNub's WebRTC page ===
'''Send only (VP8)'''
<pre style="white-space: pre-wrap;">
GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web videotestsrc is-live=true ! "video/x-raw, width=(int)640, height=(int)480, format=(string)I420, framerate=(fraction)30/1" ! vp8enc ! rtpvp8pay ! web.video_sink
</pre>


WebRTC provides a PubNub page that can be found the repository. In the following example, the port is defined as 8080:
'''Receive only (VP8)'''
<pre style="white-space: pre-wrap;">
GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web web.video_src ! rtpvp8depay ! avdec_vp8 ! xvimagesink
</pre>


<syntaxhighlight lang='bash'>
====H.264====
cd gst-webrtc/tests/examples/signalers/pubnub
python3 -m http.server 8080
</syntaxhighlight>


The following show how to establish a call using the PubNub's WebRTC page in https://localhost:8080 (Select the port you defined)
'''Send/receive (H.264)'''
<pre style="white-space: pre-wrap;">
GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! rtph264pay ! web.video_sink web.video_src ! rtph264depay ! h264parse ! avdec_h264 ! autovideosink
</pre>


[[File:pubnub_webpage.png|700px|center|Establish a WebRTC call with https://localhost:8080]]
'''Send only (H.264)'''
<pre style="white-space: pre-wrap;">
GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=123 signaler::peer-channel=471 name=web videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! rtph264pay ! web.video_sink
</pre>


# Type a unique name in the top text bar.
'''Receive only (H.264)'''
# Type the pipeline name in the bottom text bar.
<pre style="white-space: pre-wrap;">
# Select video and audio options: Disable, Send only, Receive only or Send-Receive.
GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=123 signaler::peer-channel=683 name=web web.video_src ! rtph264depay ! h264parse ! avdec_h264 ! autovideosink
# Select Data: Send-Receive or Disable
</pre>
# Select Register button.
# Start the call from the pipeline or selecting the call button on the Webpage.


== H264+Opus Send+Receive ==
== H264+Opus Send+Receive ==
Line 79: Line 113:
<syntaxhighlight lang=bash>
<syntaxhighlight lang=bash>
USER_CHANNEL=123
USER_CHANNEL=123
gst-launch-1.0 webrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! "video/x-h264,profile=constrained-baseline,level=(string)3.1" ! \
videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! "video/x-h264,profile=constrained-baseline,level=(string)3.1" ! \
rtph264pay ! web.video_sink \
rtph264pay ! web.video_sink \
Line 91: Line 125:
<syntaxhighlight lang=bash>
<syntaxhighlight lang=bash>
USER_CHANNEL=123
USER_CHANNEL=123
gst-launch-1.0 webrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
videotestsrc is-live=true ! openh264enc ! \
videotestsrc is-live=true ! openh264enc ! \
rtph264pay ! web.video_sink \
rtph264pay ! web.video_sink \
Line 107: Line 141:
<syntaxhighlight lang=bash>
<syntaxhighlight lang=bash>
USER_CHANNEL=123
USER_CHANNEL=123
gst-launch-1.0 webrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
videotestsrc is-live=true ! vp8enc ! rtpvp8pay ! web.video_sink \
videotestsrc is-live=true ! vp8enc ! rtpvp8pay ! web.video_sink \
audiotestsrc is-live=true ! opusenc ! rtpopuspay ! web.audio_sink \
audiotestsrc is-live=true ! opusenc ! rtpopuspay ! web.audio_sink \
Line 114: Line 148:
</syntaxhighlight>
</syntaxhighlight>


}}
 
{{GstWebRTC/Foot|previous=Audio + Video Examples - x86|next=AppRTC Signaler Examples - x86}}

Latest revision as of 10:49, 21 March 2023




Previous: Audio + Video Examples - x86 Index Next: AppRTC Signaler Examples - x86


GstWebRTC
WebRTC Fundamentals
GstWebRTC Basics
Signaling
Plugin Elements
Evaluating GstWebRTC
Getting the code
Building GstWebRTC
Examples
x86
iMX6
iMX8
TX1/TX2/Xavier
MCU Demo Application
Contact Us



This page shows a series of pipelines to try out the experimental PubNub support on x86 platform.

Problems running the pipelines shown on this page?
Please see our GStreamer Debugging guide for help.

PubNub Demo Pages

PubNub offers a few test web pages to try out the WebRTC signalers. 

These examples are such that audio+video is required in both ways.

PubNub's WebRTC page

WebRTC provides a PubNub page that does not require audio+video streaming in both ways. It allows the selection of sending or receiving (or both): only video, only audio and audio+video. You can access the PubNub WebRTC page from here https://webrtc.ridgerun.com:7443/. Also you can access using your localhost like in the following example, the port is defined as 8080: 

cd gst-webrtc/tests/examples/signalers/pubnub
python3 -m http.server 8080

The following show how to establish a call using the PubNub's WebRTC page in https://localhost:8080 (Select the port you defined)

Establish a WebRTC call with https://localhost:8080
Establish a WebRTC call with https://localhost:8080


  1. Type a unique name in the top text bar.
  2. Type the pipeline name in the bottom text bar.
  3. Select video and audio options: Disable, Send only, Receive only or Send-Receive.
  4. Select Data: Send-Receive or Disable
  5. Select Register button.
  6. Start the call from the pipeline or selecting the call button on the Webpage.

Note: In the following examples, the start-call property on the pipeline is set to false, thus you have to start the call from the website pressing the correct button. If start-call is set to true, the pipeline starts the call.

SimpleRTC WebPage

The following figure show how to establish a call using the SimpleRTC web page in https://kevingleason.me/SimpleRTC/minivid.html

Establish a WebRTC call with https://kevingleason.me/SimpleRTC/minivid.html
Establish a WebRTC call with https://kevingleason.me/SimpleRTC/minivid.html


  1. Type a unique name in the top text bar.
  2. Register that unique name to PubNub
  3. Type the pipeline name in the bottom text bar. In the examples 123 this would be $USER_CHANNEL or 123
  4. Start the call

PubNub Official Demo

The following figure show hows to establish a call using the official PubNub's WebRTC demo in https://www.pubnub.com/developers/demos/webrtc/

Establish a WebRTC call with https://www.pubnub.com/developers/demos/webrtc/
Establish a WebRTC call with https://www.pubnub.com/developers/demos/webrtc/


Follow these steps

  1. Make sure to type the number above the message "this is your phone number" in the pipeline description
  2. Just type the pipeline's name in the bottom text bar. In the examples 123 this would be $USER_CHANNEL or 123, don't press any of the other buttons
  3. Launch the pipeline, the call should start right away (in Chrome), a couple of seconds at most (in Firefox).

VP8

Send/receive (VP8) 

GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web videotestsrc is-live=true ! "video/x-raw, width=(int)640, height=(int)480, format=(string)I420, framerate=(fraction)30/1" ! vp8enc ! rtpvp8pay ! web.video_sink web.video_src ! rtpvp8depay ! avdec_vp8 ! xvimagesink

Send only (VP8) 

GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web videotestsrc is-live=true ! "video/x-raw, width=(int)640, height=(int)480, format=(string)I420, framerate=(fraction)30/1" ! vp8enc ! rtpvp8pay ! web.video_sink

Receive only (VP8) 

GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web web.video_src ! rtpvp8depay ! avdec_vp8 ! xvimagesink

H.264

Send/receive (H.264) 

GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=$USER_CHANNEL signaler::peer-channel=$PEER_CHANNEL name=web videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! rtph264pay ! web.video_sink web.video_src ! rtph264depay ! h264parse ! avdec_h264 ! autovideosink

Send only (H.264) 

GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=123 signaler::peer-channel=471 name=web videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! rtph264pay ! web.video_sink

Receive only (H.264) 

GST_DEBUG=3 gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=true signaler::user-channel=123 signaler::peer-channel=683 name=web web.video_src ! rtph264depay ! h264parse ! avdec_h264 ! autovideosink

H264+Opus Send+Receive

Example

This pipeline will encode a video and audio streams to H264 and OPUS accordingly and send them to the demo web page. Additionally, it will receive the web page's video and audio feeds, in the same format.

x264

It seems that browsers do not get along with x264 because of SEI NAL units sent with the stream. As a workaround, we set key-int-max=1 and avoid the SEI insertions.

USER_CHANNEL=123
gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
videotestsrc is-live=true ! x264enc aud=false key-int-max=1 tune=zerolatency intra-refresh=true ! "video/x-h264,profile=constrained-baseline,level=(string)3.1" ! \
rtph264pay ! web.video_sink \
audiotestsrc is-live=true ! opusenc ! rtpopuspay ! web.audio_sink \
web.video_src ! rtph264depay ! h264parse ! avdec_h264 ! autovideosink \
web.audio_src ! rtpopusdepay ! opusdec ! autoaudiosink

OpenH264

USER_CHANNEL=123
gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
videotestsrc is-live=true ! openh264enc ! \
rtph264pay ! web.video_sink \
audiotestsrc is-live=true ! opusenc ! rtpopuspay ! web.audio_sink \
web.video_src ! rtph264depay ! h264parse ! avdec_h264 ! autovideosink \
web.audio_src ! rtpopusdepay ! opusdec ! autoaudiosink

VP8+Opus Send+Receive

Example

This pipeline will encode a video and audio streams to VP8 and OPUS respectively and send them to the demo web page. Additionally, it will receive the web page's video and audio feeds, in the same format. 

USER_CHANNEL=123
gst-launch-1.0 rrwebrtcbin rtcp-mux=true start-call=false signaler::user-channel=$USER_CHANNEL name=web \
videotestsrc is-live=true ! vp8enc ! rtpvp8pay ! web.video_sink \
audiotestsrc is-live=true ! opusenc ! rtpopuspay ! web.audio_sink \
web.video_src ! rtpvp8depay ! avdec_vp8 ! autovideosink \
web.audio_src ! rtpopusdepay ! opusdec ! autoaudiosink



Previous: Audio + Video Examples - x86 Index Next: AppRTC Signaler Examples - x86


Retrieved from "http://developer.ridgerun.com/wiki/index.php?title=GstWebRTC_-_PubNub_Web_Pages_-_x86&oldid=48121"