- Basic SPA Matomo setup
- Will track
next/router
route changesrouteChangeComplete
event
Add the init
call in your _app.js
:
import React from "react";
import App from "next/app";
import { init } from "@socialgouv/matomo-next";
const MATOMO_URL = process.env.NEXT_PUBLIC_MATOMO_URL;
const MATOMO_SITE_ID = process.env.NEXT_PUBLIC_MATOMO_SITE_ID;
class MyApp extends App {
componentDidMount() {
init({ url: MATOMO_URL, siteId: MATOMO_SITE_ID });
}
render() {
const { Component, pageProps } = this.props;
return <Component {...pageProps} />;
}
}
export default MyApp;
Will track routes changes by default.
This wont track /login.php
or any url containing ?token=
.
init({
url: MATOMO_URL,
siteId: MATOMO_SITE_ID,
excludeUrlsPatterns: [/^\/login.php/, /\?token=.+/],
});
import { push } from "@socialgouv/matomo-next";
// track some events
push(["trackEvent", "contact", "click phone"]);
init
✓ should create a js tag and initialize (13 ms)
push
✓ should append data to window._paq (1 ms)
router.routeChangeComplete event
✓ should trackPageView with correct title on route change (4 ms)
✓ should use previousPath as referer on consecutive route change (6 ms)
excludeUrlsPatterns
✓ should excluded login.php and token variables (22 ms)
✓ should exclude initial page tracking (4 ms)
✓ should track initial page if not excluded (3 ms)