https://dino.singles/static/dinoportal/js/piwikutil.js

1/****************************************************************
2 * piwik/matomo util
3 * matomo 5.3.2 環境で作成
4 * 
5 * window._piwik の設定に従い、Matomoのトラッキングを行う
6 * ログは "_piwik:xxx" で出力される
7 * piwik.js, matomo.js の読み込みは別で行うこと
8 * window._piwik.pageview(url, title, referrer) で動的にページビューを送信
9 *   url, title, referrer は省略可能
10 * window._piwik.event(category, action, name, value) で動的にイベントを送信
11 * 
12 * windw.Matomo/window.Piwikが上書きされた場合(お客様カスタム）、
13 * eventはあきらめ、pageviewは <img> タグ方式にする
14 * 
15 * init:
16 * window._piwik = {
17 *    'BASE':'<piwik base url>',
18 *    'trackers':{
19 *        '<idsite1>':null,
20 *        '<idsite2>':null,
21 *        :
22 *    },
23 *    'pageview':null,
24 *    'event':null,
25 * }
26 *
27 * dynamic pageview:
28 * window._piwik.pageview(url, title, referrer)
29 * 
30 * dynamioc event
31 * window._piwik.event(category, action, name, value)
32 * 
33 */
34
35(function(){
36
37console.log('_piwik:initializing...', window._piwik);
38
39let _initialized = false, _Matomo = undefined, _Matomo_trusted = null;
40
41if (!window._piwik) { console.error('_piwik:matomoInit:window._piwik is not defined'); return; }
42if (window._piwik.BASE.endsWith('/')) { window._piwik.BASE + '/'; }
43
44const MATOMO_BASE = window._piwik.BASE.replace(/\/+$/, '') + '/';
45const MATOMO_JS_SRC = MATOMO_BASE + 'matomo.js';
46const MATOMO_PHP = MATOMO_BASE + 'matomo.php';
47
48function checkMatomoTrusted() {
49	// すべての script タグ読み込みが自前であることをチェック
50	if (_Matomo_trusted === false) { return false; }
51	// true or null
52	const matomo_scripts_src = Array.from(document.querySelectorAll('script[src$="matomo.js"], script[src$="piwik.js"]'))
53			.map(s => s.src);
54	const all_script_is_mine = matomo_scripts_src.every(src => src == MATOMO_JS_SRC);
55	if (!all_script_is_mine) {
56		// 別の Matomo/Piwik スクリプトが読み込まれている場合
57		_Matomo_trusted = false;
58		console.warn('_piwik:matomoInit:Matomo/Piwik script overwritten by another script:', matomo_scripts_src);
59		return false;
60	}
61	_Matomo_trusted = true;
62	return true;
63}
64
65function trackPageViewImg(idsite, url, title, referrer) {
66	// img タグ方式でページビューを送信
67	console.log('_piwik:trackPageViewImg:', idsite, url, title, referrer);
68	const img = document.createElement('img');
69	const params = new URLSearchParams({
70		idsite: idsite,
71		rec: '1',
72		url: url || location.href,
73		action_name: title || document.title,
74		urlref: referrer || document.referrer,
75		rand: Math.random().toString().slice(2)
76	});
77	img.className = 'img-piwik-tracker';
78	img.src = MATOMO_PHP + '?' + params.toString();
79	img.style.display = 'none';
80	img.width = 1;
81	img.height = 1;
82	img.alt = '';
83	img.onload = img.onerror = function() {
84		if (img.parentNode) img.parentNode.removeChild(img);
85	};
86	(document.body || document.head || document.documentElement).appendChild(img);
87}
88
89function matomoInit(){
90	
91	if (_initialized) {
92		// 二重呼び出しの防止
93		console.warn('_piwik:matomoInit:already initialized:skip', window._piwik);
94		return;
95	}
96	
97	_Matomo_trusted = checkMatomoTrusted();
98	
99	try {
100		
101		// 自前 tracker の初期化とページビューの送信
102		Object.keys(window._piwik.trackers).forEach(function(idsite){
103			if (!_Matomo_trusted) {
104				// window.Matomo が信用できない場合、img タグ方式でのトラッキングを行う
105				console.warn('_piwik:matomoInit:Matomo overwritten, using img tag for tracker idsite=' + idsite);
106				trackPageViewImg(idsite, location.href, document.title, document.referrer);
107			} else {
108				var tracker = window.Matomo.getTracker(window._piwik.BASE +'matomo.php', idsite);
109				this[idsite] = tracker;
110				tracker.trackPageView();
111				tracker.enableLinkTracking(); // tracker.tarckLink() を有効にする
112			}
113		}.bind(window._piwik.trackers));
114		
115		// pageview の定義
116		window._piwik.pageview = function(url, title, referrer) {
117			url = url || location.href;
118			title = title || document.title;
119			referrer = referrer || document.referrer;
120
121			console.log([
122				'_piwik.pageview:',
123				'url:' + url,
124				'title:' + title.replace('\n', '\n\t\t'),
125				'referrer:' + referrer
126			].join('\n\t'));
127
128			try {
129				const trackers = window._piwik.trackers;
130				// const base = window._piwik.BASE.replace(/\/+$/, '');
131				// const matomoUrl = base + '/matomo.php';
132

133				Object.entries(trackers).forEach(([idsite, tracker]) => {
134					if (!_Matomo_trusted) {
135						// window.Matomo が信用できない場合、img タグ方式でのトラッキングを行う
136						trackPageViewImg(idsite, url, title, referrer);
137					} else if (tracker) {
138						tracker.setCustomUrl(url);
139						tracker.setDocumentTitle(title);
140						tracker.setReferrerUrl(referrer);
141						tracker.trackPageView();
142					} else {
143						console.warn('_piwik.pageview: tracker not found for idsite=' + idsite);
144					}
145				});
146			} catch (ex) {
147				console.error('_piwik.pageview:error:', ex);
148			}
149		};
150		
151		// event の定義
152		// Matomoが上書きされた場合、イベントはあきらめる
153		window._piwik.event = function(category, action, name, value) {
154			console.log([
155				'_piwik.event:',
156				'category:' + category,
157				'action:' + action,
158				'name:' + name,
159				'value:' + value
160			].join('\n\t'));
161			if (_Matomo_trusted) {
162				console.warn('_piwik.event: Matomo overwritten, event tracking skipped');
163				return;
164			}
165			try {
166				const trackers = window._piwik.trackers;
167				Object.entries(trackers).forEach(([idsite, tracker]) => {
168					if (tracker) {
169						tracker.trackEvent(category, action, name, value);
170					}
171				});
172			} catch (ex) {
173				console.error('_piwik.event:error:', ex);
174			}
175		};
176		
177		_initialized = true;
178		console.log('_piwik:initialized', window._piwik);
179	} catch (ex) {
180		console.error('_piwik:initialize failed:', ex);
181		Object.keys(window._piwik.trackers).forEach(function(idsite){
182			trackPageViewImg(idsite, location.href, document.title, document.referrer);
183		});
184	}
185};
186
187// 注意: matomoAsyncInit は非公式だが、慣例的に使われている
188if (!window.Matomo) {
189	// まだロードされていない場合、window.matomoAsyncInit を定義しておく
190	// 他者による上書きチェックあり（warning表示）
191	let _internalAsyncInit = matomoInit;
192	Object.defineProperty(window, 'matomoAsyncInit', {
193		configurable: true,
194		enumerable: true,
195		get: function () {
196			return _internalAsyncInit;
197		},
198		set: function (fn) {
199			console.warn('_piwik:window.matomoAsyncInit overwritten:', fn);
200			_internalAsyncInit = fn;
201			_Matomo_trusted = false; // matomoAsyncInit が上書きされたら、Matomoは信用できない
202		}
203	});
204	// window.Matomo読み込みの検知
205	Object.defineProperty(window, 'Matomo', {
206		configurable: true,
207		enumerable: true,
208		get: function () {
209			return _Matomo;
210		},
211		set: function (val) {
212			console.log(
213				'_piwik:Matomo loaded',
214				document.querySelectorAll('script[src*="matomo.js"],script[src*="piwik.js"]')
215			);
216			if (_Matomo === undefined) {
217				console.info('_piwik:window.Matomo initialized');
218			} else {
219				console.warn('window.Matomo overwritten:', val);
220				_Matomo_trusted = false;
221			}
222			_Matomo = val;
223		}
224	});
225	// 自分で読み込む
226	let d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
227	g.async=true; g.src=MATOMO_JS_SRC; s.parentNode.insertBefore(g,s);
228	
229} else {
230	// Matomoロード済みということは、matomoAsyncInitがあったらすでに実行されていると考えられる
231	console.log('_piwik:Matomo already loaded', window.Matomo);
232	matomoInit();
233}
234console.log('_piwik:initialize done.', window._piwik);
235
236})();