How to get Google Glass, Cordova, HTML5 APIs Working (WebRTC, WebSockets).

One of the challenges I’ve noticed when developing with Cordova hybrid apps is the lack of support for the HTML5 APIs that work on desktop devices but not the default Android browser (Ice cream sandwich, Jelly bean) like webSockets and WebRTC.

Now, Google Glass currently runs on Android 4.0.3 Ice cream sandwich  and from the rumours circulating around the next update fingers crossed will put us onto 4.4 KitKat. (Can’t Wait!!)

The problem with Android 4.0.3 is that its running an old edition of WebKit customised to support Google Glass and added gesture support. Unfortunately if you’re developing rich internet applications with Cordova and want to use the latest support HTML5 techniques supported by desktop browser today – you just can’t as Cordova uses the default browser that is part of android..

Read on to find out how to get HTML5 APIs working with Cordova.

There are plugins out there ie here’s one for WebSockets.

Now for those looking purely for WebRTC support you could setup appRTC but I’ve seen a lot of bugs and issues reported with using this on glass. Another option would be to look at Addlive and try out their SDK which you can see working here with Google Glass.

A third option which I’ve gone for is to package Chromium with Cordova and use it as the default browser as it supports the majority of HTML5 APIs (ie – WebSockets, WebRTC and more..).

To do this there is a project called Crosswalk that’s designed for HTML5 mobile apps to bring in support for chromium with the blink engine on Android 4.x+.

I’ve used this with 3 custom apps I’ve built and it works great with Glass and cordova! Now when Glass KitKat arrives you should have the use of the Chromium browser as the default browser with cordova without the need to package Crosswalk. Although this does have the added benefit of blink and if you are like me and have created a single Android app to support 4.x+ devices I feel it just makes sense to spend that extra time to get Crosswalk packaged in with your app.

Here’s a quick simple example of getting your webcam from either your phone or glass to stream into the app/browser viewport.

You can grab the adapter js file -from https://code.google.com/p/webrtc/source/browse/stable/samples/js/base/adapter.js
This provides additional browser support for WebRTC.

Tip
For those using Glass make sure to update the constraints to prevent overheating and lag by reducing frame-rate and camera size.

You can play around with constraints by editing the values from here:  http://src.chromium.org/svn/trunk/src/chrome/test/data/webrtc/manual/constraints.html

 

 

 

 

 

 

8 thoughts on “How to get Google Glass, Cordova, HTML5 APIs Working (WebRTC, WebSockets).

    • You’re welcome.

      Also Google has yet to release an update of the KitKat WebView. It’s stuck at Chrome 30 whereas Crosswalk keeps being improved over the time.

  1. Hi, very interesting blogpost and I tried crosswalk myself and it works perfectly fine for my mobile phone, but what bugs me is, that I can not get the crosswalk app to work on the google glass. I mean I intalled it, but in order to start it from the google glass menu I have to add a trigger, as far as I know a voice trigger, but I have no idea how I can tell crosswalk to add these things to the AndroidManifest.xml before creating the .apk file. Any idea or clue into the right direction?

  2. By the way, there no longer appears to be a video stream available on the glass (as of XE22, Crosswalk 9.38.208.1). MediaStreamTrack.getSources() only lists an audio source now.

Leave a Reply