Using Errorception with PhoneGap

This post is more than 2 years old.

I thought I had blogged about Errorception before, but unless my search engine skills are failing me I must not have ever gotten around to it. Errorception is a service that aggregates and reports on client-side errors on your web site. By placing a simple embed in your HTML code, all errors will be sent off to their service for your perusal. When I first tested this service, I remember thinking, glibly, that I hope I'd get enough data points to make it worthwhile to demonstrate. I mean, my blog runs well, I never see any errors myself, so I just kinda assumed everything was good. Heh.

I logged in to the Errorception portal after a week and discovered that there were a huge amount of errors reported. Obviously my blog "worked", and most of these bugs were not preventing people from using my site, but I really had no idea what was going on and Errorception provided a wealth of data. Here are some screen shots from those reports. (Note that the screenshots are from last year.)

First - the general list of issues:

Then a drill down:

And yet another drill down:

Errorception is not a free service, but the pricing model seems rather fair to me and as I said - I can bet you've got more issues than you think you do.

So what about PhoneGap? When I tried to use the Errorception code snippet with PhoneGap, I noted that the error reporting didn't work. I got in contact with the Errorception team and Rakesh Pai was able to figure out the issue.

Here is the original snippet:

Rakesh noticed this:

It turns out, the problem you faced is indeed trivial, fortunately. The tracking snippet Errorception gives you is protocol-relative, so as to make it work on HTTP and HTTPS. However, on phonegap, the protocol for the 'index.html' page is file://, and so the tracking snippet fails to load (404).

The fix is simple: it's to modify the snippet to load the beacon from a hard-coded http/https protocol

Here is his modified snippet:

That worked! I fired up both my iOS simulator and my Android simulator and as soon as I forced my error they showed up immediately in the console.

Notice that the error is reported differently in iOS versus Android.

Raymond Camden's Picture

About Raymond Camden

Raymond is a senior developer evangelist for Adobe. He focuses on document services, JavaScript, and enterprise cat demos. If you like this article, please consider visiting my Amazon Wishlist or donating via PayPal to show your support. You can even buy me a coffee!

Lafayette, LA

Archived Comments

Comment 1 by Tim Meade posted on 6/13/2013 at 4:17 PM

Nice post, I've not heard of them. We are testing with which appears to be similar. Have you compared the two?

Comment 2 by Tim Meade posted on 6/13/2013 at 4:22 PM

Looks to be a good pair actually. Airbrake for CF errors and Errorception for JS. Very complimentary! Setting it up today.

Comment 3 by Raymond Camden posted on 6/13/2013 at 5:27 PM

Nope, I have yet to use

Comment 4 by Tim Badolato posted on 6/13/2013 at 5:36 PM

Very cool. I used Hoth for error tracking on my phonegap application. Its free and 100% cfml. Here is the javascript code to log errors to Hoth:

Comment 5 by Raymond Camden posted on 6/13/2013 at 6:11 PM

I knew about Hoth, but didn't know it supported client-side code. Cool.

Comment 6 by saravanakumar posted on 6/19/2013 at 7:09 PM

i dont know how is communicate to you. thats why i choose this way,,

im new to jquery mobile phonegap. i have developed the simple app with get the server response through the getJSON in Eclipse. My app get the response only in below 3.2 versions. not above 3.2 versions.But the app is run, only JSON response will not trigger.

i hope you will help me. Thank you in advance..........!

Comment 7 by Raymond Camden posted on 6/19/2013 at 7:32 PM

Have you done any debugging? For example, are you sure you are still even triggering the ajax call?

Comment 8 by saravanakumar posted on 6/19/2013 at 9:14 PM

yeah, its work properly and i got the response from the server in below 3.2 versions. still it doesn't get the proper response from server in 3.2 above that the failure function alert message displayed.

Comment 9 by Raymond Camden posted on 6/19/2013 at 9:15 PM

So what's the failure message?

Comment 10 by saravanakumar posted on 6/19/2013 at 9:40 PM

i mean fail handler alert. This is my json method.
$.getJSON('url', function(result) {
.fail(function() {
alert( "Error in send request" ); });

my logcat message is: I/Choreographer(775): Skipped 42 frames! The application may be doing too much work on its main thread.

Comment 11 by Raymond Camden posted on 6/19/2013 at 11:52 PM

Try adding 'e' as an argument to fail and alerting it.

Comment 12 by xavier posted on 7/4/2013 at 9:43 AM

Not able to access the network in my phonegap app. i tried on iPhone and iPad. Only the device ready alerts fires. Any idea what is going on? config.xml has <feature name="" /> and <access origin="*" />

Here is my index.html:
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Network testing</title>

<script src="phonegap.js"></script>

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
alert("device is ready");"", reachableCallback, {});

// Check network status
function reachableCallback(reachability) {
alert("checking Connection");
// There is no consistency on the format of reachability
var networkState = reachability.code || reachability;
var states = {};
states[NetworkStatus.NOT_REACHABLE] = 'No network connection';
states[NetworkStatus.REACHABLE_VIA_CARRIER_DATA_NETWORK] = 'Carrier data connection';
states[NetworkStatus.REACHABLE_VIA_WIFI_NETWORK] = 'WiFi connection';
alert('Connection type: ' + states[networkState]);

<p>Expecting alerts with the network connection status</p>

Comment 13 by Raymond Camden posted on 7/4/2013 at 6:58 PM

According to the docs, this is not supported:

Comment 14 by xavier posted on 7/4/2013 at 7:50 PM

The code was from the docs ( i just used that to show an example so someone else can try. The app does not connect to anything on the internet including jQuery CDN. i am able to browse to our data service on our server with Safari on the same phone. The iPhone is using beta IOS 7 but tried on other devices also (iPad, Android phone) with the same results. Any settings in the app that i am missing?

Comment 15 by Raymond Camden posted on 7/4/2013 at 8:13 PM

That is a very old version of PhoneGap. You need to be using the latest version. Also, PhoneGap isn't officially supported on iOS 7 yet.

Comment 16 by Neil Pugh posted on 7/25/2013 at 1:42 PM

There's a couple of errors on this page Ray

- The "View Raw" links in the code snippets go to Page Not Found.
- The modified snippet code example is missing part of the opening line of code.

Comment 17 by Neil Pugh posted on 7/25/2013 at 2:20 PM

It works nicely in my web browser when I hardcoded the protocol to "http". It doesn't play ball though on my devices. I whitelisted the domain and I am running PhoneGap 2.9 and I tested on Android 2.2 and Android 4.1. I get an ErrorCeption error message when running in Android 2.2: Line 1 : Posted 0 errors to

I get no message at from Android 4.1

What version of PhoneGap and Android did you test with Ray?

Comment 18 by Neil Pugh posted on 7/25/2013 at 2:27 PM

I should also add that I placed the javascript include as the first js file pulled in, even before phonegap etc...

Comment 19 by Raymond Camden posted on 7/25/2013 at 3:20 PM

"View Raw" - looks to be a bug w/ Gists. I'll try to raise it with Github. I modified the second snippet to be complete, thanks.

As for your error - well I tested with iOS only, but the dev I worked w/ at Errorception he tested it on a couple of platforms. I'll ping him.

Comment 20 by Neil Pugh posted on 7/30/2013 at 1:11 PM

Hey, thank Ray :)