-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add Amplitude's browser SDK and web experiment for future A/B testing (…
…#2345) * add: amplitude analytics * add: amlitude web experiment * fix: document issue? * fix: build issue * add: dotenv for only tracking in production
- Loading branch information
Showing
4 changed files
with
234 additions
and
25 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| import * as amplitude from '@amplitude/analytics-browser'; | ||
|
|
||
| let amplitudeInstance = null; | ||
|
|
||
| // Utility to get cookie by name | ||
| const getCookie = (name) => { | ||
| if (typeof window !== 'undefined') { | ||
| const value = `; ${document.cookie}`; | ||
| const parts = value.split(`; ${name}=`); | ||
| if (parts.length === 2) return parts.pop().split(';').shift(); | ||
| return null; | ||
| } | ||
| return null; | ||
| }; | ||
|
|
||
| // Extract the Google Analytics Client ID from the _ga cookie | ||
| const getGoogleAnalyticsClientId = () => { | ||
| const gaCookie = getCookie('_ga'); | ||
| if (gaCookie) { | ||
| const parts = gaCookie.split('.'); | ||
| return parts.length === 4 ? `${parts[2]}.${parts[3]}` : null; | ||
| } | ||
| return null; | ||
| }; | ||
|
|
||
| export const initializeAmplitude = () => { | ||
| // Check if we're already initialized | ||
| if (!amplitudeInstance && process.env.NODE_ENV === 'production') { | ||
| // Extract the Google Analytics Client ID | ||
| const googleAnalyticsClientId = getGoogleAnalyticsClientId(); | ||
| if (!googleAnalyticsClientId) { | ||
| console.warn('Google Analytics Client ID not found in cookies.'); | ||
| } | ||
|
|
||
| // Initialize Amplitude with the client ID as the deviceId | ||
| amplitudeInstance = amplitude.init( | ||
| '181a95e5a6b8053f7ffb7da9f0ef7ef4', // This key is Public | ||
| googleAnalyticsClientId, | ||
| { | ||
| ...(googleAnalyticsClientId && { deviceId: googleAnalyticsClientId }), | ||
| autocapture: true, | ||
| } | ||
| ); | ||
| } | ||
| }; | ||
|
|
||
| export const amplitudeTrack = (eventName, eventProperties) => { | ||
| if (amplitudeInstance) { | ||
| try { | ||
| const googleAnalyticsClientId = getGoogleAnalyticsClientId(); | ||
| amplitude.track({ | ||
| event_type: eventName, | ||
| deviceId: googleAnalyticsClientId, | ||
| event_properties: eventProperties, | ||
| }); | ||
| } catch (error) { | ||
| console.error('Error tracking Amplitude event:', error); | ||
| } | ||
| } else { | ||
| console.error('Amplitude is not initialized.'); | ||
| } | ||
| }; | ||
|
|
||
| if (typeof document !== 'undefined') { | ||
| initializeAmplitude(); | ||
| } |
Oops, something went wrong.