Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Firebase Analytics doesn't work for Web app #2600

Closed
agordeev opened this issue Feb 6, 2020 · 36 comments
Closed

Firebase Analytics doesn't work for Web app #2600

agordeev opened this issue Feb 6, 2020 · 36 comments

Comments

@agordeev
Copy link

agordeev commented Feb 6, 2020

[REQUIRED] Describe your environment

  • Operating System version: macOS
  • Browser version: Firefox 72.0.2 (64-bit)
  • Firebase SDK version: 7.8.0
  • Firebase Product: analytics

[REQUIRED] Describe the problem

I've added a web app in Firebase console to integrate Firebase Analytics:

Screenshot 2020-02-06 at 08 20 37

The problem is Firebase Analytics doesn't show any data for the web app. Like the website has no visits at all. I tried few ways to integrate Analytics:

<script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-app.js"></script>
<!-- If you enabled Analytics in your project, add the Firebase SDK for Analytics -->
<script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-analytics.js"></script>
<script>
  const firebaseConfig = {
    ...
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>
<script src="/__/firebase/7.8.0/firebase-app.js"></script>
<script src="/__/firebase/7.8.0/firebase-analytics.js"></script>
<script src="/__/firebase/init.js"></script>

nothing worked.

Quite similar issue described here: https://stackoverflow.com/questions/58484726/firebase-analytics-not-showing-data-for-web-application with no answer.

By the way, I use custom domain.

@google-oss-bot
Copy link
Contributor

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

@rommelpe
Copy link

rommelpe commented Feb 6, 2020

Sorry to hear about your issues, @agordeev. Looking at your config, it doesn't seem to be an issue. The initial data logged usually takes up to 24 hours to display and 3-4 hours delay for the succeeding data.

If the issue persists after 24 hours, given that you've properly added Analytics SDK, you may check the following:

  • Make sure that the correct “filters” are applied or clear any filters. This can often cause the report to show no data if it doesn't have any users that meet the criteria.

  • Provide screenshot of DebugView. It enables you to see the raw event data logged by your app on development devices in near real-time

@hsubox76
Copy link
Contributor

hsubox76 commented Feb 6, 2020

First of all, are you seeing any errors in the console, or in the Network tab?

Second, In the documentation linked above for DebugView, the Web tab tells you to install the Google Analytics Debugger Chrome extension that will let you set debug mode and view information that is (or isn't) being sent from that page. For a quicker and less user-friendly option, you can also look at your Chrome Dev Tools Network tab and check for a POST request to an endpoint that starts with https://www.google-analytics.com/g/collect? . If you find this, that means the client side code is correctly sending analytics data to the backend.

Finally, just in case, check to see if your firebaseConfig object has a measurementId field. This was newly added when we introduced analytics, and if you are reusing an older config it's possible you may not have it.

@agordeev
Copy link
Author

agordeev commented Feb 7, 2020

@rommelpe @hsubox76 thanks for suggestions.

  1. It's been a week since I integrated analytics. No data since then.
  2. I've been checking StreamView, it's also empty.
  3. I'm sorry, but I don't really want to install any extension. I believe that is not required to get analytics data from the website.
  4. Console prints a warning:
A cookie associated with a cross-site resource at http://google.com/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
  1. No POST requests made neither on Firefox nor Chrome.
  2. My config has measurementId.

PS: Hmm, interesting.. It records events if I use Google Chrome. But still nothing for Firefox and Safari.

@hsubox76
Copy link
Contributor

hsubox76 commented Feb 8, 2020

Do you get different results when you try this on localhost?

Edit: I've tried your first snippet (with my firebaseConfig) in Chrome and Firefox on localhost and they both show a visit in the "Users in last 30 minutes" panel in Analytics > Dashboard.

@agordeev
Copy link
Author

agordeev commented Feb 8, 2020

Same result if I try on localhost: Chrome works, but others don't.

@hsubox76
Copy link
Contributor

Hm, I've tried creating a raw index.html file with the exact code you've put in your first snippet (with my project config) and serving it locally with http-server and visiting it with Chrome, Firefox, and Safari, and all of them result in hits I see in my Firebase Console Analytics Dashboard. From the screenshot your app looks like a standard webapp.

Is there anything else you can think of that might be unusual about your environment? Private browsing? Iframes?

@agordeev
Copy link
Author

No, that's a standard static one page website based on Bootstrap.

@neekey
Copy link

neekey commented Mar 9, 2020

I'm having the same issue:

  • No data from ga
  • No data from debugView
  • I'm testing with Chrome
  • Tried both custom or domain by firebase

I'm using the automatic configure way to setup firebase:

<script src="/__/firebase/7.8.0/firebase-app.js"></script>
<script src="/__/firebase/7.8.0/firebase-analytics.js"></script>
<script src="/__/firebase/init.js"></script>

the measuurementId exists, I manually call firebase.analytics().logEvent('notification_received'); will trigger request to https://www.google-analytics.com/g/collect?

@neekey
Copy link

neekey commented Mar 9, 2020

if I go to GA and manually create a new Web StreamView and use google tagjs:

<!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-xxxxxx"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'G-xxxxxxx');
    </script>

I will be able to see the data show up in my GA

@glockjt
Copy link

glockjt commented Mar 9, 2020

I am getting this same issue, using this same config. It would be great to get some feedback on how to address this issue.

I'm using the automatic configure way to setup firebase:

<script src="/__/firebase/7.8.0/firebase-app.js"></script>
<script src="/__/firebase/7.8.0/firebase-analytics.js"></script>
<script src="/__/firebase/init.js"></script>

the measuurementId exists, I manually call firebase.analytics().logEvent('notification_received'); will trigger request to https://www.google-analytics.com/g/collect?

@hsubox76
Copy link
Contributor

hsubox76 commented Mar 9, 2020

the measuurementId exists, I manually call firebase.analytics().logEvent('notification_received'); will trigger request to https://www.google-analytics.com/g/collect?

So just to confirm, it is sending a request to that endpoint? Would you be able to share the contents of that request, with any proprietary strings redacted?

For the second user, are you also seeing that network request sent?

@hsubox76
Copy link
Contributor

hsubox76 commented Mar 9, 2020

I'm sorry, I haven't been able to reproduce this. I've tried it with an existing project and a new project. I created an index.html file that contains only this:

<script src="/__/firebase/7.8.0/firebase-app.js"></script>
<script src="/__/firebase/7.8.0/firebase-analytics.js"></script>
<script src="/__/firebase/init.js"></script>
<script>
  firebase.analytics().logEvent('notification_received');
</script>

Then I

  • created a new project in the Firebase console
  • created a new Google Analytics project when prompted (instead of using an existing one)
  • In the dir containing the index.html I ran firebase init and gave it the project ID of the project I just made
  • ran firebase deploy --only hosting

When I went to the url created, I saw the POST to the /collect? endpoint and when I went to the Firebase console Analytics dashboard I saw 1 "users in the last 30 minutes".

Is there anything different that you can think of? For example:

  • Did you use an existing or new Firebase app? If existing, did you have to add Analytics to it?
  • Did you use an existing GA project? (one of the prompts when creating a new Firebase project)
  • Is there any special circumstance about the hosting? Custom domain, multiple sites in one project?
  • Does this page include any other scripts or libraries?
  • Any ad blocker or tracking blocker extensions?
  • Browser? User above mentioned that Chrome works but not Firefox or Safari.

I would like to track down what's going on here but since I can't reproduce it, we need to narrow down what the cause could be.

@nickharder88
Copy link

nickharder88 commented Mar 10, 2020

I believe the issue is that in this documentation, it isn't apparent that you have to add this line after loading /__/firebase/init.js,

<script>
  firebase.analytics().logEvent('notification_received');
</script>

Once I added that, analytics started working. I didn't even add the logEvent('notification_received'); call, simply adding firebase.analytics(); will work.

@edpin
Copy link

edpin commented Mar 28, 2020

I was having the same problem, but @nickharder88's solution above worked for me. Thanks!

@rupeshpadhye
Copy link

rupeshpadhye commented Apr 14, 2020

I am also facing similar issue , I tried to user firebase analytics in chrome extension. Initially I don't see any analytics XHR calls.
After I added following statement , I saw the server request
firebase.analytics().logEvent('notification_received');

But even after 24 hours I don't see any data on dashboard.

@hsubox76
Copy link
Contributor

Just want to clear it up for everyone: I only put logEvent('notification_received') in the example because I was replying to a user using that in their sample code.

In order to initialize Analytics you only need the line firebase.analytics(), as mentioned here: https://firebase.google.com/docs/analytics/get-started?platform=web#start_logging_events

I can ask the docs team to try to make it more prominent.

As for not seeing it in the dashboard, if the POST request to the collect? endpoint is being sent, then it should be working on the client side and there may be some trouble on the server side, which I can report to that team if data fails to show up for over a week. Basically, sometimes there are delays in service for short periods of time, and then the data starts showing up again, and I don't think the team can debug it if it's not broken at the time they look at it.

@rupeshpadhye
Copy link

@hsubox76 when i initialise analysis with firebase.analytics() , I don't see any POST request in network tab

@hsubox76
Copy link
Contributor

Sorry, I was trying to address the general idea that the logEvent('notification_received') is needed.

Unfortunately, Firebase Analytics is not currently supported in Chrome Extensions. See the Supported Environments page for more info on where features are supported:
https://firebase.google.com/support/guides/environments_js-sdk

@google-oss-bot
Copy link
Contributor

Hey @agordeev. We need more information to resolve this issue but there hasn't been an update in 5 weekdays. I'm marking the issue as stale and if there are no new updates in the next 5 days I will close it automatically.

If you have more information that will help us get to the bottom of this, just add a comment!

@agordeev
Copy link
Author

@hsubox76 what kind of info are you expecting? I'm still experiencing this on Firefox.

@hsubox76
Copy link
Contributor

hsubox76 commented Apr 23, 2020

See comment above for how I tried to reproduce it, and further questions whose answers might help me reproduce it: #2600 (comment)

Any help in reproducing this in a fresh environment would be great. If I'm not able to reproduce it and no one can think of any further ideas for now that might reproduce it, I won't be able to make any progress pinpointing what is wrong and will close the issue. Don't worry, anyone can always add a comment if they have any new information or can put together a minimal repro that always exhibits this problem. But I would need new information, because comments along the lines of "I am also experiencing this problem" do tell us about the impact, which is important, but don't help us reproduce and debug.

Edit: Also after feedback from some of the additional commenters, I do have an action item to update the Analytics "Getting Started" docs to make sure the firebase.analytics() initialization command is more prominent. I understand this isn't the problem with the original post though.

@RWOverdijk
Copy link

RWOverdijk commented Apr 24, 2020

I'm having the exact same issue.

The GA addon doesn't log anything.

Not sure if it matters but:

  • My stack is expo with react native web.
  • I am calling firebase.analytics()
  • Adding firebase.analytics().logEvent('notification_received'); doesn't solve it
  • I'm testing on localhost.
  • The config has been set correctly.
  • The GA plugin doesn't show anything on brave but...

It works in google chrome. Events are being logged. it doesn't work in any other browser. Not even other chromium based browsers like Brave or Edge are working.

What other info can we provide to help resolve this?

@jeremytenjo
Copy link

jeremytenjo commented Apr 26, 2020

Logs are not being recorder.

import firebase from 'firebase/app'
import 'firebase/analytics'

import config from './config'

firebase.initializeApp(config)

firebase.analytics()
firebase.analytics().logEvent('login')

Environment:

  • chrome
  • google analytics debugger installed
  • localhost
  • web app

@AaliaLokhandwala
Copy link

I have a similar issue. I have initialized firebase and the initial setup is in place.
I can also see events in the local build on debug view.
However, when trying to run a production build with a URL, events are not logged.
Please help!

@jeremytenjo
Copy link

@AaliaLokhandwala can you please share your case that works locally ?

@AaliaLokhandwala
Copy link

AaliaLokhandwala commented Apr 27, 2020 via email

@jeremytenjo
Copy link

@AaliaLokhandwala can you share a code snippet 🙏?

@AaliaLokhandwala
Copy link

AaliaLokhandwala commented Apr 27, 2020

Sure this is the code snippet @tenjojeremy :
`import firebaseConfig from './firebaseConfig
import firebase from 'firebase/app'
import 'firebase/analytics'

firebase.initializeApp(firebaseConfig)
const firebaseAnalytics = firebase.analytics()`

@RWOverdijk
Copy link

@hsubox76 What info do you need for this issue? I mean, to satisfy the label "needs-info"?

I can share my code with you (in a closed environment of course) if that helps? I'm available for a call for example to walk through this and help find the cause.

@johngrimsey
Copy link

johngrimsey commented Apr 29, 2020

I just had this issue until I disabled the uBlock Origin adblocker extension. Just incase somebody else forgets about that... 🤦‍♂️

@hsubox76
Copy link
Contributor

hsubox76 commented May 4, 2020

I have set up a few tools to help debug, and also updated the documentation.

  1. I have updated the Firebase Analytics Getting Started documentation to make it clear that you must initialize analytics with firebase.analytics(), which hopefully clears up confusion for some users.

  2. To help debug different environments I set up a website using Firebase hosting and Firebase automatic configuration: https://ch-autoconfigure.web.app/ Go there, using the browser and environment you are seeing issues on, and follow the instructions to determine whether or not the page is sending the analytics POST request. All the code for that page is in index.html.

    You may want to copy the setup yourself for various reasons. If so, here's the repo for that page: https://github.com/hsubox76/firebase-analytics-cdn-test

    • If this page works for you in some browsers/OS but not others, please let me know which (and double check that your browser's adblock/privacy settings are not deliberately blocking it).
    • If this page does not work in any browsers or OS, including Chrome on Mac (our main dev environment) please let me know the time. Perhaps there was a backend outage.
    • If you set this up in your own project (changing nothing except the hosting settings
  3. I created a separate repo for using Firebase Analytics through the NPM-installed packages (not CDN script tags). You can use this to build and serve locally, to determine if the problem might be something in your OS or something else specific to your dev environment that we did not have when developing and testing.

    That repo is here, with instructions on how to build and serve: https://github.com/hsubox76/firebase-analytics-minimal

    • As with the CDN page, once you start this locally, you can see if it works in different environments. You can also deploy it to your own hosting sites and see if it works or breaks on a particular host.
    • You can also start adding small amounts of code, or build steps, that you have in your own project, until one of these additions breaks it, in which case that will be really helpful to send along to us to help us narrow down what's not working. By starting with this minimal project and only adding just what is needed to break it, we can eliminate a lot of chasing down unrelated code.

The purpose of these two repos is that they're minimal and confirmed to work in our dev environment.

  • If it doesn't work in one of your environments, we can use that info to narrow it down to an environment incompatibility.
  • If it does work and your code doesn't, you can use it to compare and do some kind of bisect debugging to narrow down which difference might be causing the problem.
  • If it doesn't work in any environment for you, but does work a few days later, or did work a day ago, this points to a temporary backend outage, and we'd like to know the dates and times for those.

I definitely want to sort out any Analytics bugs that are going on, but it's very tricky because of all the factors that could be involved. I hope some of this will be useful in rooting out extraneous factors and narrowing down the real bugs, which we can then get to fixing!

@agordeev
Copy link
Author

agordeev commented May 5, 2020

@hsubox76 Thank you for your effort! It was uBlock Origin who blocked the requests.

@RWOverdijk
Copy link

check that your browser's adblock/privacy settings are not deliberately blocking it

This. I'm using Brave and it's not having it. So Google Analytics is essentially useless for our platform then?

@kevinlearnsthings
Copy link

Super helpful thread. Thank you all! @hsubox76, do you know if Firebase has any plan to support analytics for Chrome Extensions or if anyone's created a workaround?

We're migrating an app over to Firebase at the moment and this is our last thing to figure out before giving the project a big green light. We currently use Google Analytics.

@LennardSchwarz
Copy link

Super helpful thread. Thank you all! @hsubox76, do you know if Firebase has any plan to support analytics for Chrome Extensions or if anyone's created a workaround?

We're migrating an app over to Firebase at the moment and this is our last thing to figure out before giving the project a big green light. We currently use Google Analytics.

I would be very interested in this as well. I want to use Firebase to A/B test features in a Chrome browser extension and I need analytics to work for this.

@firebase firebase locked and limited conversation to collaborators Jun 18, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests