Tracking campaign information using the react integration

API & integrations
1

We use the GitHub - PiwikPRO/react-piwik-pro: A dedicated Piwik PRO library that helps with implementing Piwik PRO Tag Manager and the Piwik PRO tracking client in React-based applications. integration and due to the dynamic nature of our pages had to revert to manual page view tracking.
Now I’d like to setup the tracking of campaign parameters, they don’t seem to come through and using the react integration I don’t see a way to add them manually.

Anyone has done this before and can point me to the right documentation/code snippet?

2

Campaign are automatically recognized based on the page url (which, naturally, contains utm params in this case).

Could you elaborate on what you’d like to achieve?

3

exactly that but I have the impression that when using PageViews.trackPageView() from the react component none of the campaign parameters come through/get recognized.

4

Could you paste a full request from the tracker debugger view? You can use the </> icon to get it.
image

5

URL used: Luxe - Luxe - 010-Oyster | BRU

[
	{
		"headers": [
			[
				"sec-ch-ua-mobile",
				"?0"
			],
			[
				"sec-fetch-site",
				"cross-site"
			],
			[
				"sec-fetch-dest",
				"empty"
			],
			[
				"cookie",
				"<anonymized>"
			],
			[
				"accept-encoding",
				"gzip, deflate, br"
			],
			[
				"host",
				"brutex-qa.piwik.pro"
			],
			[
				"content-length",
				"508"
			],
			[
				"sec-fetch-mode",
				"no-cors"
			],
			[
				"accept-language",
				"en-GB,en;q=0.9,en-US;q=0.8,nl;q=0.7,es;q=0.6,fr;q=0.5"
			],
			[
				"x-forwarded-proto",
				"https"
			],
			[
				"x-forwarded-for",
				"<anonymized>"
			],
			[
				"pragma",
				"no-cache"
			],
			[
				"sec-ch-ua",
				"\" Not;A Brand\";v=\"99\", \"Microsoft Edge\";v=\"103\", \"Chromium\";v=\"103\""
			],
			[
				"user-agent",
				"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.5060.66 Safari/537.36 Edg/103.0.1264.44"
			],
			[
				"content-type",
				"application/x-www-form-urlencoded; charset=utf-8"
			],
			[
				"origin",
				"http://localhost:8000"
			],
			[
				"referer",
				"http://localhost:8000/"
			],
			[
				"cache-control",
				"no-cache"
			],
			[
				"accept",
				"*/*"
			],
			[
				"sec-ch-ua-platform",
				"\"Windows\""
			]
		],
		"host": "brutex-qa.piwik.pro",
		"id": "9f65f95d-a8fb-494f-9a1e-0e78c8294a2c",
		"ip": "<anonymized>",
		"method": "POST",
		"query_params": {
			"_idts": "1657285914",
			"_idvc": "1",
			"_viewts": "1657285914",
			"action_name": "Luxe - Luxe - 010-Oyster | BRU",
			"dimension1": "BRU",
			"dimension3": "17019",
			"dimension6": "true",
			"dimension7": "false",
			"gt_ms": "14",
			"h": "15",
			"idsite": "5d115803-1e7b-4703-b119-d899aa433aeb",
			"m": "11",
			"pv_id": "WqIhAz",
			"rec": "1",
			"s": "54",
			"send_image": "0",
			"t_ae": "339",
			"t_as": "337",
			"t_ce": "325",
			"t_cs": "324",
			"t_dc": "6219",
			"t_di": "2314",
			"t_dl": "372",
			"t_ds": "11",
			"t_ee": "6227",
			"t_fs": "1",
			"t_le": "2315",
			"t_ls": "2314",
			"t_qs": "325",
			"t_ue": "344",
			"t_us": "344",
			"ts_n": "jstc_tm",
			"ts_v": "2.7.1",
			"url": "http://localhost/en/account/bru/landing/17019"
		},
		"scheme": "https",
		"time": "2022-07-08T13:11:54.052965743Z"
	}
]
6

Are you sure that the tracked page view had all the utm tags? The call sent to Piwik PRO didn’t include them:

"url": "http://localhost/en/account/bru/landing/17019"
7

The page view is being tracked using the react library according to this documentation:
GitHub - PiwikPRO/react-piwik-pro: A dedicated Piwik PRO library that helps with implementing Piwik PRO Tag Manager and the Piwik PRO tracking client in React-based applications.

I’m not sure what else I can do to get the parameters there? I’m 100% sure the url I used to test did include the campaign parameters.
Is this a bug in the react library maybe?

8

I’ll let the team check that and get back to you then.

1 Like
9

Is there any update on this?

10

Hello @robin.astle,

We’re still working on this in the Integrations team, we’ll need some more time to find out what’s causing this.

11

@Hello @robin.astle

Thank you very much for reporting the problem. We apologise for the inconvenience.

We have analysed it in our team and managed to track down the problem.

We have released a new version of the package on NPM which contains the fix. It is now available for use.

Please check and confirm that the problem has been resolved.

1 Like
12

Thanks for the fix, I’m currently out of office but have asked my team to check this already next week.

13

Hello,

I work with @robin.astle and as mentioned, we’ve updated the @piwikpro/react-piwik-pro library to version 1.1.1, which seems to be the latest and we now see the parameters in the raw request (url property) in the debugger, as well as data coming in the campaign report.

Thank you for your help

2 Likes