GStreamer WebRTC Wrapper/GStreamer Pipelines/OWR Pipelines: Difference between revisions

From RidgeRun Developer Wiki
 
(41 intermediate revisions by 5 users not shown)
Line 1: Line 1:
<noinclude>
<noinclude>
{{GStreamer WebRTC Wrapper/Head|next=Other_WebRTC_RidgeRun_products|previous=GStreamer_Pipelines/Pubnub_Pipelines|keywords=}}
{{GStreamer WebRTC Wrapper/Head|next=GStreamer_Pipelines/OWR Datachannel Demo|previous=GStreamer_Pipelines/Pubnub_Pipelines|metakeywords=OpenWebRTC, OWR Demo}}
</noinclude>
</noinclude>


= Description =
<br>
<table>
<tr>
<td><div class="clear; float:right">__TOC__</div></td>
<td valign=top>
{{GStreamer debug}}
</td>
</table>


This page presents some GStreamer examples pipeline on supported platforms using the OpenWebRTC (OWR) Demo.
== Description ==


<noinclude>{{GStreamer WebRTC Wrapper/Foot|GStreamer_Pipelines/Pubnub_Pipelines|Other_WebRTC_RidgeRun_products}}</noinclude>
This page presents some GStreamer examples pipelines on supported platforms using the OpenWebRTC (OWR) Demo.


= Launch OWR Demo =
== Launch OWR Demo ==


* Install nodejs
1. Install nodejs
  sudo apt install nodejs
  sudo apt install nodejs


* Start signaler
2. Start the signaler running it as background. This will print the port for the signaler which you will use for the '''SERVER_URL'''.
<syntaxhighlight lang=bash>
<syntaxhighlight lang=bash>
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
node signaler.js
node signaler.js &
</syntaxhighlight>
</syntaxhighlight>


* Start web client in the PC. By default the web client starts at port 8080. To use a different port provide it as an argument at the end.
3. Start the web client on the PC. By default, the web client starts at port 8080. To use a different port provide it as an argument at the end.
 
<syntaxhighlight lang=bash>
<syntaxhighlight lang=bash>
#Start web client at port 8080
#Start web client at port 8080
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
node owr_web_client_example.js
node owr_web_client_example.js &
#Start web client at port 8082
#Start web client at port 8082
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
node owr_web_client_example.js 8082
node owr_web_client_example.js 8082 &
</syntaxhighlight>
 
4. Enter the web client at http://localhost:8080/ as default (remember to change port accordingly) and type the server (signaler) URL where it is running. For example, http://10.251.101.124:8081, where 10.251.101.124 is the IP address of the system where the signaler is running. Then press 'join' in the web client. Don't forget to activate the video option to watch the example.
 
5. To set up the WebRTC sender (media server) use one of the pipelines in the following sections.
 
== Pipeline examples per platform ==
 
=== x86 ===
 
==== Unidirectional ====
 
===== Video =====
 
====== H.264 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
x264enc key-int-max=2 ! rtph264pay ! web.
</syntaxhighlight>
 
====== VP8 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
vp8enc ! rtpvp8pay ! web.
</syntaxhighlight>
 
====== Data Channel  ======
 
<br>
{{Colored box|background-title-color=#6586B9|title-color=#FFFFFF|icon=notice-icon-white.png
  |title='''Note'''
  |content=Please make sure the chat checkbox in the OWR web client is checked.}}
 
{{Colored box|background-title-color=#6586B9|title-color=#FFFFFF|icon=notice-icon-white.png
  |title='''Note'''
  |content=This feature is only available for GStreamer 1.18 and newer.}}
<br>
 
===== H264 codec =====
 
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 webrtcwrapperbin start-call=true data-channel=true metadata=hello_world \
signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
x264enc key-int-max=2 ! rtph264pay ! web.
</syntaxhighlight>
 
<center>
[[File:Test wrapper data channel hello world.png|800px]]<br>
'''Figure 1.''' Data channel Web Demo
</center>
<br>
The browser page should look like in '''Figure 3''', where the message sent "hello_world" appears in the chat window.
 
<br>
{{Colored box|background-title-color=#6586B9|title-color=#FFFFFF|icon=notice-icon-white.png
  |title='''Note'''
  |content=Please make sure that the '''URL''' you are using in your browser is the same as '''SERVER_URL''' and the '''ID''' for the connection is '''SESSION_ID''' and are the same as those used in the pipeline.'''}}
<br>
 
==== Bidirectional ====
 
===== Video =====
 
====== H.264 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
x264enc key-int-max=2 ! rtph264pay ! web. web. ! rtph264depay ! avdec_h264 ! autovideosink
</syntaxhighlight>
</syntaxhighlight>


= Pipeline examples per platform =
====== VP8 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081


== x86 ==
gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
vp8enc ! rtpvp8pay ! web. web. ! rtpvp8depay ! avdec_vp8 ! autovideosink
</syntaxhighlight>
 
====== Communication between two WebRTCWrapper elements ======
<br>
{{Colored box|background-title-color=#6586B9|title-color=#FFFFFF|icon=notice-icon-white.png
  |title='''Note'''
  |content=For this communication you just need to start the ''signaler.js'' script on step 2 of the following section [[#Launch_OWR_Demo|Launch OWR Demo]].}}
<br>
 
Communication starter pipeline:
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! video/x-raw,width=640,height=480,framerate=30/1 ! \
videoconvert ! x264enc key-int-max=2 ! h264parse ! rtph264pay ! web. web. ! rtph264depay ! avdec_h264 ! autovideosink
</syntaxhighlight>
 
Receiving peer pipeline:
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 webrtcwrapperbin start-call=false signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! video/x-raw,width=640,height=480,framerate=30/1 ! \
videoconvert ! x264enc key-int-max=2 ! h264parse ! rtph264pay ! web. web. ! rtph264depay ! avdec_h264 ! autovideosink
</syntaxhighlight>
 
=== NVIDIA Jetson devices ===
The following pipelines are created using NVIDIA resources like cameras, video codecs.
 
==== Unidirectional ====
 
===== Video =====
 
====== H.264 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2h264enc maxperf-enable=1 ! rtph264pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web
</syntaxhighlight>
 
====== VP8 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2vp8enc maxperf-enable=1 ! rtpvp8pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web
</syntaxhighlight>
 
==== Bidirectional ====
 
===== Video =====
 
====== H.264 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2h264enc maxperf-enable=1 ! rtph264pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web web. ! rtph264depay ! decodebin ! autovideosink
</syntaxhighlight>
 
====== VP8 ======
<syntaxhighlight lang=bash>
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081
 
gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2vp8enc maxperf-enable=1 ! rtpvp8pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web web. ! rtpvp8depay ! decodebin ! autovideosink
</syntaxhighlight>


== Nvidia Jetson devices ==
The following pipelines may be launched in the Nvidia Jetson devices: TX1, TX2, Nano, Xavier AGX/NX


<noinclude>{{GStreamer WebRTC Wrapper/Foot|GStreamer_Pipelines/Pubnub_Pipelines|GStreamer_Pipelines/OWR Datachannel Demo}}</noinclude>
[[Category:GStreamer WebRTC Wrapper]]
[[Category:GStreamer WebRTC Wrapper]]

Latest revision as of 17:17, 11 July 2023




Previous: GStreamer_Pipelines/Pubnub_Pipelines Index Next: GStreamer_Pipelines/OWR Datachannel Demo





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

Description

This page presents some GStreamer examples pipelines on supported platforms using the OpenWebRTC (OWR) Demo.

Launch OWR Demo

1. Install nodejs

sudo apt install nodejs

2. Start the signaler running it as background. This will print the port for the signaler which you will use for the SERVER_URL.

cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
node signaler.js &

3. Start the web client on the PC. By default, the web client starts at port 8080. To use a different port provide it as an argument at the end.

#Start web client at port 8080
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
node owr_web_client_example.js &
#Start web client at port 8082
cd <path-to-gst-webrtc-wrapper>/tests/examples/signalers/owr
node owr_web_client_example.js 8082 &

4. Enter the web client at http://localhost:8080/ as default (remember to change port accordingly) and type the server (signaler) URL where it is running. For example, http://10.251.101.124:8081, where 10.251.101.124 is the IP address of the system where the signaler is running. Then press 'join' in the web client. Don't forget to activate the video option to watch the example.

5. To set up the WebRTC sender (media server) use one of the pipelines in the following sections.

Pipeline examples per platform

x86

Unidirectional

Video
H.264
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
x264enc key-int-max=2 ! rtph264pay ! web.
VP8
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
vp8enc ! rtpvp8pay ! web.
Data Channel


Note
Please make sure the chat checkbox in the OWR web client is checked.
Note
This feature is only available for GStreamer 1.18 and newer.


H264 codec
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=true data-channel=true metadata=hello_world \
signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
x264enc key-int-max=2 ! rtph264pay ! web.


Figure 1. Data channel Web Demo


The browser page should look like in Figure 3, where the message sent "hello_world" appears in the chat window.


Note
Please make sure that the URL you are using in your browser is the same as SERVER_URL and the ID for the connection is SESSION_ID and are the same as those used in the pipeline.


Bidirectional

Video
H.264
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
x264enc key-int-max=2 ! rtph264pay ! web. web. ! rtph264depay ! avdec_h264 ! autovideosink
VP8
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! queue ! videoconvert ! \
vp8enc ! rtpvp8pay ! web. web. ! rtpvp8depay ! avdec_vp8 ! autovideosink
Communication between two WebRTCWrapper elements


Note
For this communication you just need to start the signaler.js script on step 2 of the following section Launch OWR Demo.


Communication starter pipeline:

SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=true signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! video/x-raw,width=640,height=480,framerate=30/1 ! \
videoconvert ! x264enc key-int-max=2 ! h264parse ! rtph264pay ! web. web. ! rtph264depay ! avdec_h264 ! autovideosink

Receiving peer pipeline:

SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 webrtcwrapperbin start-call=false signaler=GstOwrSignaler \
signaler::server_url=${SERVER_URL} \
signaler::session_id=${SESSION_ID} name=web videotestsrc is-live=true ! video/x-raw,width=640,height=480,framerate=30/1 ! \
videoconvert ! x264enc key-int-max=2 ! h264parse ! rtph264pay ! web. web. ! rtph264depay ! avdec_h264 ! autovideosink

NVIDIA Jetson devices

The following pipelines are created using NVIDIA resources like cameras, video codecs.

Unidirectional

Video
H.264
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2h264enc maxperf-enable=1 ! rtph264pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web
VP8
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2vp8enc maxperf-enable=1 ! rtpvp8pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web

Bidirectional

Video
H.264
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2h264enc maxperf-enable=1 ! rtph264pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web web. ! rtph264depay ! decodebin ! autovideosink
VP8
SESSION_ID=59078bedca1
SERVER_URL=http://localhost:8081

gst-launch-1.0 nvarguscamerasrc sensor-id=0 ! nvvidconv ! queue leaky=2 max-size-buffers=5 ! nvv4l2vp8enc maxperf-enable=1 ! rtpvp8pay ! webrtcwrapperbin signaler=GstOwrSignaler signaler::server_url=${SERVER_URL} signaler::session_id=${SESSION_ID} start-call=true name=web web. ! rtpvp8depay ! decodebin ! autovideosink


Previous: GStreamer_Pipelines/Pubnub_Pipelines Index Next: GStreamer_Pipelines/OWR Datachannel Demo