Track a Cordova / Ionic app with Matomo

[mattab]

The goal of this issue is to collect feedback around how people track Cordova/ionic mobile apps using Matomo.

One of the limitations is that cookies may not be supported in these apps, so if this is confirmed, tracking accuracy may be affected as explained in this faq (impact of tracking without cookies)

Maybe the solution to this issue could involve writing a Cordova / ionic plugin for Matomo tracking, like it exists for others (GA, Mixpanel, etc.). Or maybe we could make our own JavaScript tracker work by using Local storage when cookies are not available.

Would also be good to create a new FAQ about Cordova / ionic analytics with Matomo to let people know when they search (we had a similar one about phonegap tracking).

Be great if you can comment in this issue with your feedback measuring a Cordova / ionic app with Matomo :+1:

[GitFr33]

I have had very good results using Matomo for analytics in Cordova Apps.

The integration has been quite straight-forward and I've had no issues with lack of cookies. I did have to set up my own do-not-track option using localstorage.

One area of Cordova app analytics that is a challenge with Matomo is new user attribution. I have not managed to track where new app installs come from using matomo.

[mattab]

Thanks for the feedback @GitFr33 :+1:

[mattab]

Created FAQ How do I track a Cordova / Ionic mobile app with Matomo Analytics?

[APalau82]

Hey

Did anyone succeed in implementing Matomo into Ionic app ?

I tried to follow the instructions with the 'ngx-matomo' package but the tracker did not separate the pages. I had every time the same page tracked, with the title of my 'index.html' page title...

Please any help or example of Matomo integration with Ionic would be really appreciated

[GitFr33]

I don't know about ionic and whether it has a build in method for handling pseudo page load type navigation but using Matomo with cordova apps that are a single (index.html) file with asynchronous javascript navigation I used the trackPageView() with a custom page title to set retentive page view data.

[APalau82]

I don't know about ionic and whether it has a build in method for handling pseudo page load type navigation but using Matomo with cordova apps that are a single (index.html) file with asynchronous javascript navigation I used the trackPageView() with a custom page title to set retentive page view data.

Thanks. In the same idea I used the matomo tracker component with the ngx-matomo package.

// component
import { Component } from '@angular/core';
import { MatomoTracker } from 'ngx-matomo';

@Component({
  selector: 'app',
  template: `<router-outlet></router-outlet>`
})
export class AppComponent {
  constructor(
    private matomoTracker: MatomoTracker
  ) { }

  ngOnInit() {
    this.matomoTracker.setUserId('UserId');
    this.matomoTracker.setDocumentTitle('ngx-Matomo Test');
  }
}

But never get the tracker on my dashboard. I never saw the ngx-Matomo Test page title in my stats.

[GitFr33]

I'm not sure but I believe that setDocumentTitle() has to be called before trackPageView(), have you confirmed that you are calling them in the correct sequence? Also, you could try specifying the page title as the argument of trackPageView([customTitle]) i nstead of using setDocumentTitle which is how I got it working.

[jorisdrenth]

Just set up Matomo in my Ionic app, and it works pretty good.

I followed the instructions of the readme of ngx-matomo. At every page of my app I added the following to ngOnInit(): ngOnInit() { this.matomoTracker.trackPageView('PageTitle'); } Update: set this in ionViewDidLoad() for better accuracy.

Pageviews show up in my Matomo dashboard, although the url is the same for all pageviews (http://localhost/). The report at Behaviour > Page titles gives an overview of all viewed pages which can be further analysed.

For some specific actions in my app I'm also tracking events like explained in the readme: this.matomoTracker.trackEvent('Category', 'Action', 'Name', NumValue);

The missing cookies doesn't seem to be much of a problem, but I'll have to test this more when my app is live.

I'm not sure but I believe that setDocumentTitle() has to be called before trackPageView(), have you confirmed that you are calling them in the correct sequence?

I'm not using setDocumentTitle() and it works, so I don't think it's needed at all.

Hope this helps anyone. It may not be the full 100% integration, but it gives me more than enough data to analyse.

[Maqsyo]

I think this page is really helpful for your cordova-app https://developer.matomo.org/guides/spa-tracking

The question i have is -> how do you handle if the user is offline? I'm thinking of saving the paq-array in an persistet file and collect all entries until the user has an connection again and hopefully matomo will clear this array if the connection was successfully. Do you think this will work out?

[mattab]

The question i have is -> how do you handle if the user is offline?

@Maqsyo this will be a new feature that we need to implement in Matomo itself. Check our progress on https://github.com/matomo-org/matomo/issues/9939

[futuravis]

I am facing issue with loading the motoma.js file. its working fine in angular web app. not in the ios ionic app.

[BenLaKnet]

Hi,

I tried matomo in a cordova project with this function :

function AppMatomoTracking() {
//<!-- Matomo -->
    var _paq = window._paq = window._paq || [];
    /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
    _paq.push(['trackPageView']);
    _paq.push(['enableLinkTracking']);

    (function() {
        var u="https://mywebsite.com/analytics/";
        _paq.push(['setTrackerUrl', u+'matomo.php']);
        _paq.push(['setSiteId', '3']);

        //var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
        //g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);

        var d=document, g=d.createElement('script'), s=d.getElementsByTagName('head')[0];

        g.async=true; 
        g.src=u+'matomo.js';
        s.appendChild(g);

    })();
//<!-- End Matomo Code -->
}

I modify the javascript to insert at the end of head the matomo.js I adjust CSP for using "url" correctly before adding jaascript.

But it seems that Matomo does not detect something. I do not have any visit in my main board.

[BenLaKnet]

I am trying the API HTTP and it is running. I inject directly variables into url matomo.php.

[mattab]

To track users and behavior analytics for your Cordova / Ionic mobile apps, you simply need to embed the Matomo Tracking code (JavaScript) into your app.

Additionally if your Cordova or Ionic app is a Single Page Application, read the SPA Tracking guide.

Cordova/Ionic apps don’t support cookies so you can learn how this will affect the accuracy of reports and tracking.

If you have any feedback or question about tracking your Cordova / Ionic app, please consider asking in the forums: https://forum.matomo.org/ :+1: