Rpi WebRTC Streamer to Android WebRTC streaming

In this article I will setup Android WebRTC streaming to RPI-WebRTC-Streamer running on my Raspberry PI Zero W, to talk to each other.

Here is the architecture of RPI-WebRTC-Streamer.

Now why do we use WebRTC instead of directly streaming audio/video through a socket from the Raspberry PI to the Android device ?

It is helpful to understand how WebRTC works under the hood and how a connection is established.

The magic in WebRTC is the probing of the connection to allow two clients to talk P2P ( Peer-to-Peer ), even if they are behind a firewall or using NAT. There are plenty of online resources devoted to this complex topic ( E.g. https://www.html5rocks.com/en/tutorials/webrtc/infrastructure/ )

The basic steps in establishing a WebRTC connection are:

  • Step 1: Signaling: both peers connect to a signaling server (using websockets over 80/443, comet, SIP,etc..) and exchange information (about their media capabilities, public IP:port pairs when they become available, etc.)
  • Step 2: Discovery: Devices connected to LAN or mobile networks are not aware of their public IP (and port) where they can be reached at so they use STUN servers located on the public Internet to discover their ip:port pair (ICE candidates). In the process they punch a hole through the NAT/router which is used in step3:
  • Step 3: P2P connection: once the ICE candidates are exchanged through the initial signaling channel each peer is aware of each other’s ip:port (and holes have been punched in NATs/routers) so a peer to peer UDP connection can be established.
  • Step 4: If a P2P connection can’t be established ( maybe through firewall rules or the usage of Symmetric NAT ) then TURN servers can be used, which will relay the data between the peers. Please note that this will require the TURN server to receive and send all video and audio and is the last resort in WebRTC.

Under normal circumstances you would establish the connection between two web-browser. However in this case I need to establish Android WebRTC streaming to the Raspberry PI Zero W. Fortunately we have the required tools and libraries available on both platforms and can take full advantage of this technology stack. This allows us to basically build a video conference similar to skype between the Raspberry PI and Android. As an aside, iOS can also handle WebRTC, which may be a project for later.

Android WebRTC Streaming:

  1. Lets first make sure you have the RPI WebRTC Streamer setup, as explained in my previous post.
  2. Then you have to install ADB onto your computer to be able to transfer the App to your Android phone.
  3. Connect your Android phone to your computer and make sure you have the developer option enabled
  4. Next get the source code for RPI WebRTC Streamer from github and install it onto your phone, like so.
    bash> git clone https://github.com/kclyu/rpi-webrtc-streamer.git
    bash> cd rpi-webrtc-streamer/misc
    bash> adb install AppRTCMobile.apk
    
  5. Next open the app on your Android phone
  6. Change settings of the Video encoder to H264 High
  7. Change the resolution to VGA(640 x 480)
  8. And then simply enter the IP address of your raspberry PI as the room number
Android WebRTC streaming in action
Android WebRTC streaming in action

Finally, here is the article from mpromonet if you ever feel like compiling rpi-webrtc-streamer https://www.raspberrypi.org/forums/viewtopic.php?t=186271.
You can even use docker containers to make things easier: https://hub.docker.com/r/mpromonet/webrtc-streamer/

As an aside, I found multiple Android app templates to use WebRTC

uv4l WebRTC vs rpi-webrtc-streamer

I have spent the past two days working with the uv4l driver to get WebRTC working. I eventually got everything to work with three major issues

  1. I could not get the transmitted quality to anything close to what I needed
  2. I could not get rid of the the watermark which was put over the video
  3. The complete CPU utilization for 640×480 was above 90% and caused issues.

Another slightly annoying issue was that I had to re-install Jessie after I found out that uv4l is currently not available for Raspbian stretch lite. I could only find the full version for Jessie, which requires at least a 8GB microSD card. And off I went to replace my 4GB microSD card.

On the positive side I installed rpi-webrtc-streamer from github and was able to look at the results in realtime right away.

Unlike uv4l, which is based off OpenWebRTC from Ericson, rpi-webrtc-streamer is based off the Native Code from www.WebRTC.org which seems to be a bit more responsive than uv4l.

Here are the steps I had to do to get things to work.

bash>  # First create a home for the code
bash>  mkdir utils && cd utils
bash>  git clone https://github.com/kclyu/rpi-webrtc-streamer.git

You can find the Android App under rpi-webrtc-streamer/misc/AppRTCMobile.apk
But first lets avoid the work and go straight to installing the software.

Go to https://github.com/kclyu/rpi-webrtc-streamer-deb and download the appropriate deb-package.

bash>  dpkg -i rws_xxx_armhf.deb
bash>  sudo systemctl start rws

Then simply point your browser at http://<IP Address>:8889/native-peerconnection/

Raspberry PI camera
Raspberry PI camera

I will be going through the setup and usage of the Android App which is part of rpi-webrtc-sstreamer in one of my next blog entries.

Cheap $7,- external usb sound card

I bought the following external usb sound card from Amazon for $7,- to integrate into my Video Doorbell project.

 

External USB sound card
External USB sound card

So why did I chose to go this route. Simple, I was looking at some audio pHATs  for the Raspberry PI and found that they will cost about $4,- a pop, then of course you also need a microphone, and bang you are at around $9,- to $10,-. So paying $7,- for a audio I/O ( 7.1 sound card ) is a smart choice. Another thing I saw which won me over was that the setup is quit simple.

Note: This link above will point to the same sound card for only $4,-.

In order to do the setup I connected a micro-USB male to USB female adapter to my PI zero and made two small changes.
Please note though that I do intend to remove the USB plug all together and solder things together in the final setup.

1: Find the US sound card number ( in my case the USB card is card # 1 )

aplay -l
**** List of PLAYBACK Hardware Devices ****
card 0: ALSA [bcm2835 ALSA], device 0: bcm2835 ALSA [bcm2835 ALSA]
Subdevices: 8/8
Subdevice #0: subdevice #0
Subdevice #1: subdevice #1
Subdevice #2: subdevice #2
Subdevice #3: subdevice #3
Subdevice #4: subdevice #4
Subdevice #5: subdevice #5
Subdevice #6: subdevice #6
Subdevice #7: subdevice #7
card 0: ALSA [bcm2835 ALSA], device 1: bcm2835 ALSA [bcm2835 IEC958/HDMI]
Subdevices: 1/1
Subdevice #0: subdevice #0
card 1: Set [C-Media USB Headphone Set], device 0: USB Audio [USB Audio]
Subdevices: 1/1
Subdevice #0: subdevice #0

2: create a file /etc/asound.conf with the following contents

pcm.!default {
        type hw
        card 1
}

ctl.!default {
        type hw
        card 1
}

3: and finally test the speaker :

  speaker-test -c2 -twav

This concluded the setup and testing. To use this external USB sound card in my project it had to fit tightly into the chassis which I built from scratch. So the USB plug had to come off and I had to solder some wires onto the card to connect t up to the Raspberry PI.

Video Doorbell assembly
external USB soundcard after removal of USB plug

Raspberry PI Zero W as Chromecast

So one of the thing which I tried out was to see if the PI Zero can handle video streaming to our TV.

In order to setup the Raspberry PI Zero W as Chromecast, I followed the series of 7 videos below and plugged it into our large TV. However the result was unusable. The video did only play for a second or two before the whole thing stopped and tried to continue playing.

This is not too surprising considering that the PI Zero has only a single core 1GHz CPU while the instructions assume the PI 2 or 3 which has a quad core CPU to handle the stress.

Step 1 : Raspbian Jessie Lite Install Guide

Step 2: Raspbian Jessie Lite wifi config

Step 3 : Raspbian update upgrade omxplayer

Step 4 : Install youtube download video and python

Step 5 : Raspbian Jessie Lite Golang

Step 6 : Raspberry pi as Youtube TV

Please feel free to sign up or follow my home made hardware projects here …

AstraNOS for the stars

So I have not written anything about AstraNOS, my web desktop, for a while. That was for a good reason, as I was busy doing a batch of other things the past months.

However I have never give up on it and I am still using it heavily all the time to store pics, ideas, notes, videos and other things.

Progress

I recently fixed my AWS instance and re-enabled Conference, my WebRTC based video conferencing tool. Also since I always have a multitude of windows open I added a virtual desktop feature to the mix.

 

The number of virtual desktops is currently hardcoded to 4 however I believe that this will be plenty. The current version of AstraNOS is now grown up enough to handle a lot of the everyday tasks. It provides a central place online to -feel-at-home.

Feel free to sign up for a free account <a href=”https://www.AstraNOS.org/virtual”>Here</a>, connect your DropBox account and link some youtube videos to your folders.

Raspberry PI Video Doorbell

I recently went to a Microcenter near by and bought an Raspberry PI Zero W

Raspberry Pi Zero W
Raspberry Pi Zero W

For $5,- I could simply not resist. Not only is this a full blown computer with micro-hdmi out, it also can be used to connect other hardware to it with ease. The connector on the right is there to connect a camera to the PI Zero.
Well, after installing raspbian onto a micro-SD card, I went ahead and bought a camera as open-box item for only $12,- and got the combo to work in no time flat.

That is all well and good but what can you truly do with this hardware ? The answer for me is/was

Home Automation.

I have looked into

Ring Video Doorbell
Ring Video Doorbell

However my issue was not so much the price of these devices, after all it takes a lot of effort and money to develop a great product, it was the physical shape and size which made any of the available products unusabe for me.

So I thought I would simply add a few pieces together and create my own Video Doorbell from scratch using the PI and a few other software and hardware parts, which can be found online.

It is of course very helpful, that there is such a huge community behind the PI and that almost everything you can come up with has been attempted before. So googling around I found a bunch of sites with similar goals, like this one here.

Raspberry Pi Security System

Here are the next steps to get from idea to finished project.

  1. Building the chassis ( and BOM )
  2. Connecting the camera
  3. Adding microphone and speaker
  4. Installing a notification server ( pushd )
  5. Writing a cross platform app ( iOS / Android )
  6. Connecting all the pieces

Feel free to subscribe to my blog

DyGraphs Pie Chart Plotter

DyGraphs is a decent Javascript library to plot time series data points.

DyGraphs plotter
DyGrpahs

I chose DyGraphs a long time ago mainly due to its small footprint of 123530 bytes for dygraph.2.0.0.min.js

One of the things it allows you to do now is to add a different plotter algorithm to plot data. One such example can be found on the demo page is that of a BarChart plotter. If you look at the code it is a fairly small addition.

One of the possible plots missing though is a PieChart. It happened that I needed a PieChart for my project and I did not want to switch to E.g. ChartJS [ Release 2.5.0 ] so I wrote my own little PieChart function for DyGraphs.

function pieChartPlotter ( e ) {
        var ctx  = e.drawingContext;
        var self = e.dygraph.user_attrs_.myCtx;
        var itm, nme, data = self._pieData;
        if ( ! data )  {
          var t, i, y, all, total = 0;
          data = {};
          all = e.allSeriesPoints; // array of array
          for ( t=0; t

The one thing you will see in this code is that I calculate the required PieChart data once and then check for its existance each time I enter this function. This is requried beause DyGraph does currently not call the plotter function in a context but rather in the global browser context ( I.e. the this object is the browser Window ).

So instead I ‘added’ ( read hacked ) myCtx to the dygraphs – plotter options to gain access to my local JavaScript object where I buffer the _pieData.

DyGraphs Pie Chart plotter
DyGraphs Pie Chart plotter

While this may not be the nicest pie chart around, it is a small, basic function which can be expanded on fairly easily.

Addendum: Here is how to use this code

    this._options  = {
      labels: ["Date","Count"],
      legend: 'always',
      title:  "  ",
      myCtx: this,
      animatedZooms: true,
      hideOverlayOnMouseOut: false,
      stackedGraph: false,
      clickCallback    : this.onGraphClicked,
      showRangeSelector: true,
      underlayCallback : this.highlightWeekend,
      legendFormatter  : this.legendFormatter,
      highlightSeriesOpts : {
        strokeWidth: 3,
        strokeBorderWidth: 1,
        highlightCircleSize: 5
      }
    };
    this._chart = new Dygraph ( dom, this._data.data, this._options );
    ...