chore: update measurement-protocol

README.md

@@ -97,7 +97,7 @@ Supported environment variables for managing a Badgen instance.
 - `GITHUB_API_GRAPHQL` - Custom Github GraphQL API endpoint. e.g., `https://github.mycompany.com/api/graphql`
 - `NPM_REGISTRY` - Custom NPM registry endpoint
 - `SENTRY_DSN` - Sentry Error Monitoring Data Source Name
-- `TRACKING_GA` - Google Analytics Tracking ID
+- `GA_MEASUREMENT_ID` - Google Analytics Measurement ID
 
 ## Contributors
 

libs/create-badgen-handler-next.ts

@@ -1,5 +1,5 @@
 import http from 'http'
-import { measure } from 'measurement-protocol'
+// import { measure } from 'measurement-protocol'
 import matchRoute from 'my-way'
 
 import { serveBadgeNext } from './serve-badge-next'
@@ -26,6 +26,8 @@ export function createBadgenHandler (badgenServerConfig: BadgenServeConfig) {
   async function nextHandler (req: NextApiRequest, res: NextApiResponse) {
     let { pathname } = new URL(req.url || '/', `http://${req.headers.host}`)
 
+    measurementLogInvocation(req.headers?.host ?? 'badgen.net', pathname)
+
     if (pathname === '/favicon.ico') {
       return res.end()
     }
@@ -82,15 +84,38 @@ function onBadgeHandlerError (meta: any, err: Error | HTTPError, req: NextApiReq
   })
 }
 
-const { TRACKING_GA, NOW_REGION } = process.env
-const tracker = TRACKING_GA && measure(TRACKING_GA).setCustomDimensions([NOW_REGION || 'unknown'])
 
-async function measurementLogInvocation (host: string, urlPath: string) {
-  tracker && tracker.pageview({ host, path: urlPath}).send()
+type MeasurementProtocolEvent = {
+  name: string;
+  params: Record<string, any>;
 }
 
-async function measurementLogError (category: string, action: string, label?: string, value?: number) {
-  tracker && tracker.event(category, action, label, value).send()
+function measure (clientId: string, events: MeasurementProtocolEvent[]) {
+  const { GA_MEASUREMENT_ID, GA_API_SECRET } = process.env
+
+  if (!GA_MEASUREMENT_ID || !GA_API_SECRET) return
+
+  const searchParams = `measurement_id=${GA_MEASUREMENT_ID}&api_secret=${GA_API_SECRET}`
+  fetch(`https://www.google-analytics.com/mp/collect?${searchParams}`, {
+    method: "POST",
+    body: JSON.stringify({
+      client_id: clientId,
+      events,
+    })
+  })
+}
+
+function measurementLogInvocation (host: string, pathname: string) {
+  const { VERCEL_REGION = '0000' } = process.env
+
+  measure(VERCEL_REGION, [{
+    name: 'invocation',
+    params: {
+      host,
+      pathname,
+      name: pathname.split('/')[1]
+    }
+  }])
 }
 
 function getBadgeStyle (req: http.IncomingMessage): string | undefined {

libs/serve-doc.ts

@@ -4,7 +4,7 @@ import { serveMarked } from 'serve-marked'
 import serve404 from '../libs/serve-404'
 import { BadgenServeConfig } from '../libs/create-badgen-handler'
 
-const { TRACKING_GA = 'G-PD7EFJDYFV' } = process.env
+const { GA_MEASUREMENT_ID = 'G-PD7EFJDYFV' } = process.env
 
 export default function serveDoc (conf: BadgenServeConfig): http.RequestListener {
   return (req, res) => {
@@ -19,12 +19,12 @@ export default function serveDoc (conf: BadgenServeConfig): http.RequestListener
         beforeHeadEnd: `
           <link rel="icon" href="/favicon.png" />
           <!-- Google tag (gtag.js) -->
-          <script async src="https://www.googletagmanager.com/gtag/js?id=${TRACKING_GA}"></script>
+          <script async src="https://www.googletagmanager.com/gtag/js?id=${GA_MEASUREMENT_ID}"></script>
           <script>
             window.dataLayer = window.dataLayer || [];
             function gtag(){dataLayer.push(arguments);}
             gtag('js', new Date());
-            gtag('config', '${TRACKING_GA}');
+            gtag('config', '${GA_MEASUREMENT_ID}');
           </script>
         `,
         beforeBodyEnd: helpFooter,

vercel.json

@@ -20,7 +20,7 @@
   "env": {
     "GH_TOKENS": "@badgen-gh-tokens",
     "SENTRY_DSN": "@badgen-sentry-dsn",
-    "TRACKING_GA": "@badgen-tracking-ga",
+    "GA_MEASUREMENT_ID": "@badgen-tracking-ga",
     "GITLAB_TOKENS": "@badgen-gl-tokens"
   }
 }