Firebase Analytics Googletagmanager Error

user_12533883 0
Viewed 1810

I'm getting this error from Firebase, I added Analytics to my project today, and now the landing page shows this error in the console.

helpers.ts:72 GET https://www.googletagmanager.com/gtag/js?l=dataLayer net::ERR_BLOCKED_BY_CLIENT

I'm not importing GTAG in my index.html (i'm using React) this thing

<script async src="https://www.googletagmanager.com/gtag/js"></script>

Because I'm not using it.

and my config file for Firebase looks like this

import firebase from "firebase/app";
import "firebase/firestore";
import "firebase/auth";
import "firebase/analytics";

// Your web app's Firebase configuration
var firebaseConfig = {
  //the usual
  measurementId: "G-something",
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
export const auth = firebase.auth();
export const db = firebase.firestore();
export const firestore = firebase.firestore;
export const analytics = firebase.analytics;

Landing page

import { analytics } from "../configs/fbConfig";`
  useEffect(() => {
    analytics().setCurrentScreen(window.location.pathname); // sets `screen_name` parameter
    analytics().logEvent("screen_view"); // log event with `screen_name` parameter attached
    analytics().logEvent("landing_page_view", { landing_at: Date.now() });
  });

That's all i have, i want to log when the user see the landing page, so I can use a Funnel ( I believe ) to track the process from Landing to Login page.

Do I have to create something in the Firebase Console to make this work ? documentation for web analytics is kind of messy..

firebase firebase-analytics reactjs google-analytics javascript
1 Answers

In vast majority of cases the net::ERR_BLOCKED_BY_CLIENT means your addblocker blocks tracking. Here how it looks on the console:

enter image description here

Always disable addblockers when you do GTM/GA/Launch/AA/Tealium/Ensighten/Piwik/Matomo debugging/implementation.

This is how it typically looks on the Network tab: (blocked:other)

enter image description here

Note that (blocked:devtools) is not caused by an adblocker, but rather by the request blocking feature of devtools.

Also you say web analytics, and yet you use Firebase. Firebase is a raw product, severely lacking functionality. I suggest using Google Analytics to track web hits even if it's mobile web.

Finally, since you're using React, I assume it's an SPA. In case of an SPA, you have to have a separate pageview tag in GTM that would be triggered by, say, a custom dataLayer event fired from your React app router on page change. Then you can start building funnels.

user_37009930
Related