Fix #8396 Multiple webanalytics events send per single page load (#8402)

* Fix Multiple webanalytics events send per single page load #8396

* Add comments

* Do not throw error for collect API
This commit is contained in:
Sachin Chaurasiya 2022-10-28 14:45:35 +05:30 committed by GitHub
parent 537499fa61
commit c74d5a9b18
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 40 deletions

View File

@ -102,9 +102,17 @@ const AppRouter = () => {
) : null;
useEffect(() => {
// track page view on route change
analytics.page();
}, [location]);
const { pathname } = location;
/**
* Ignore the slash path because we are treating my data as
* default path.
*/
if (pathname !== '/') {
// track page view on route change
analytics.page();
}
}, [location.pathname]);
return loading ? (
<Loader />

View File

@ -12,7 +12,6 @@
*/
import Analytics, { AnalyticsInstance } from 'analytics';
import { AxiosError } from 'axios';
import { postPageView } from '../axiosAPIs/WebAnalyticsAPI';
import { WebPageData } from '../components/WebAnalytics/WebAnalytics.interface';
import { PageViewEvent } from '../generated/analytics/pageViewEvent';
@ -20,7 +19,6 @@ import {
WebAnalyticEventData,
WebAnalyticEventType,
} from '../generated/analytics/webAnalyticEventData';
import { showErrorToast } from './ToastUtils';
/**
* Check if url is valid or not and return the pathname
@ -64,10 +62,7 @@ export const trackPageView = async (pageData: WebPageData, userId: string) => {
const { payload } = pageData;
const { location, navigator, performance, document } = window;
const { hostname, pathname } = location;
// store the current path reference
let currentPathRef = pathname;
const { hostname } = location;
const pageLoadTime = getPageLoadTime(performance);
@ -75,43 +70,33 @@ export const trackPageView = async (pageData: WebPageData, userId: string) => {
const referrer = properties.referrer ?? document.referrer;
const previousPathRef = getReferrerPath(referrer);
// timestamp for the current event
const timestamp = meta.ts;
if (userId) {
/**
* Check if the previous path and current path is not matching
* then only collect the data
*/
if (currentPathRef !== previousPathRef) {
currentPathRef = previousPathRef;
const pageViewEvent: PageViewEvent = {
fullUrl: properties.url,
url: properties.path,
hostname,
language: navigator.language,
screenSize: `${properties.width}x${properties.height}`,
userId,
sessionId: anonymousId,
referrer,
pageLoadTime,
};
const pageViewEvent: PageViewEvent = {
fullUrl: properties.url,
url: properties.path,
hostname,
language: navigator.language,
screenSize: `${properties.width}x${properties.height}`,
userId,
sessionId: anonymousId,
referrer,
pageLoadTime,
};
const webAnalyticEventData: WebAnalyticEventData = {
eventType: WebAnalyticEventType.PageView,
eventData: pageViewEvent,
timestamp,
};
const webAnalyticEventData: WebAnalyticEventData = {
eventType: WebAnalyticEventType.PageView,
eventData: pageViewEvent,
timestamp,
};
try {
// collect the page event
await postPageView(webAnalyticEventData);
} catch (error) {
showErrorToast(error as AxiosError);
}
try {
// collect the page event
await postPageView(webAnalyticEventData);
} catch (_error) {
// handle page view error
}
}
};