| Website | Status | Active Users | Today Earnings | Page Views | Impressions | Clicks | Page CTR | Ad CTR | CPC | Page RPM | Imp RPM | Last Updated |
|---|
Today's Earnings
$0.00
Never
Active Users
0
Realtime Live
Page Views
0
Today aggregated
Impressions
0
Today aggregated
Clicks
0
Today aggregated
Avg Page CTR
0.00%
Today averaged
Credentials Required
To fetch data from your GA4 and Google AdSense websites, please configure your Client IDs, Client Secrets, and Refresh Tokens in the Settings tab.
No Websites Added
Settings configured successfully! Now add some websites to start tracking their live traffic and monetization.
Managed Websites
Configure your website specific reporting metrics keys.
| Website | Domain | GA4 Property ID | AdSense Publisher ID | AdSense Refresh Token | Actions |
|---|
No websites configured. Click "Add Website" to get started.
Global Integration Settings
Configure key Google API configurations for the dashboard.
API Logs
View real-time and local execution logs of the Google API fetches.
| Timestamp | Event Type | Website | Status | Message / Response Details |
|---|
Logs list is empty.
About & Setup Instructions
How This Dashboard Works
MetricsHub is a high-performance **stateless monitoring tool** built for site administrators, bloggers, and SaaS publishers. By using a Cloudflare Worker, we fetch Google Analytics 4 (GA4) Realtime users and Google AdSense Today earnings in parallel directly from Google's servers.
Step-by-step Setup Guide
1
Google Cloud Console Project
Create a Google Cloud Project, enable the Google Analytics Data API and AdSense Management API under "API Library".
2
OAuth Consent Screen
Configure your OAuth Consent Screen. Add the scopes: .../auth/analytics.readonly and .../auth/adsense.readonly.
3
Create OAuth 2.0 Web Application Credentials
Generate a Client ID and Client Secret. Set authorized redirect URI to: https://developers.google.com/oauthplayground (or your web application URL).
4
Acquire Refresh Tokens
Visit Google OAuth Playground, select GA4 and AdSense scopes, log in with your account, and hit "Exchange authorization code for tokens" to get your refresh tokens. Enter these values into the Settings tab.
Encryption Note: This application communicates with your custom Cloudflare Worker. When you enter settings or website refresh tokens, the browser asks the worker to encrypt them. The resulting base64 cipher text is stored in your browser's local storage. This ensures your secrets are never exposed on the web client or static server in plain text.