SDK 37 - Firebase Google Analytics Measurement ID Setup

  1. SDK Version: 37
  2. Platforms(Android/iOS/web/all): iOS (i haven’t tried in Android)

Firstly, thanks for releasing so many valuable updates in SDK 37.

Context:
I am trying to test Firebase Analytics within my Expo Client app. Separately, I am also trying to test Firebase Analytics within my iOS APK in TestFlight. I have been following the details on the following links using firebase analytics with expo and the detailed guide you recommend here.

The part that gets me confused is this one:

It proved to be impossible to get native Firebase Analytics working reliably in the Expo client, so we created a custom Firebase Analytics JavaScript implementation that can communicate with the Google Analytics back-end.

The Github link in the quote above does not give any concrete info on how to use the JS bundle for Expo client.

Here are the steps I’ve taken thus far, this may helps others trying to do the same…

  1. Setup Firebase app
  2. Connect Firebase app to Google Analytics
  3. Make sure the iOS app is correctly setup in Admin / Properties / Data Streams
  4. Make another app but this time WEB inside Admin / Properties / Data Streams
  5. Get the Measurement ID from this newly created WEB app (note that the iOS app does not have a measurement ID, it took me a long time to figure this step out)
  6. Create a TAG in Google Tag Manager that is trigged by ALL EVENTS and is connected to the measurement ID from step 5. (this information is almost impossible to find, I pasted a link at the bottom that talks about this)
  7. Put the measurement ID in the app.json as per the documentation in the first link way above.
  8. Open Expo Client on my phone (or simulator) and interact with my app
  9. Here is where it starts to fall apart…I am clicking around all of Analytics with my Expo Client app open and I data doesn’t appear (even after 24 hours). I’ve looked at DebugView and Real Time views.

Some other helpful links I have found:

What part am I missing so that I can see Analytics running while in my Expo Client?

I am also getting the following warning in the Expo Client:

Firebase Analytics is not available in the Expo client. See "https://docs.expo.io/versions/latest/sdk/firebase-analytics" on more information on setting up Firebase Analytics with the standard Expo client.
- node_modules/expo/build/environment/muteWarnings.fx.js:18:23 in warn
- node_modules/@bugsnag/plugin-console-breadcrumbs/console-breadcrumbs.js:16:6 in console.method
- node_modules/expo-firebase-analytics/build/ExpoFirebaseAnalytics.js:40:17 in callAnalyticsModule
- node_modules/expo-firebase-analytics/build/ExpoFirebaseAnalytics.js:51:15 in <global>
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:271:30 in invoke
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:135:28 in invoke
- node_modules/regenerator-runtime/runtime.js:170:17 in Promise$argument_0
- node_modules/promise/setimmediate/core.js:45:7 in tryCallTwo
- node_modules/promise/setimmediate/core.js:200:23 in doResolve
- node_modules/promise/setimmediate/core.js:66:12 in Promise
- node_modules/regenerator-runtime/runtime.js:169:27 in Promise$argument_0
- node_modules/regenerator-runtime/runtime.js:192:38 in enqueue
- node_modules/regenerator-runtime/runtime.js:216:8 in exports.async
- node_modules/expo-firebase-analytics/build/ExpoFirebaseAnalytics.js:51:15 in <global>
- node_modules/expo-firebase-analytics/build/Analytics.js:74:7 in setCurrentScreen
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:271:30 in invoke
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:135:28 in invoke
- node_modules/regenerator-runtime/runtime.js:170:17 in Promise$argument_0
- node_modules/promise/setimmediate/core.js:45:7 in tryCallTwo
- node_modules/promise/setimmediate/core.js:200:23 in doResolve
- node_modules/promise/setimmediate/core.js:66:12 in Promise
- node_modules/regenerator-runtime/runtime.js:169:27 in Promise$argument_0
- node_modules/regenerator-runtime/runtime.js:192:38 in enqueue
- node_modules/regenerator-runtime/runtime.js:216:8 in exports.async
- node_modules/expo-firebase-analytics/build/Analytics.js:74:7 in setCurrentScreen
* App.js:84:44 in AppNavigator.props.onNavigationStateChange
- node_modules/path-to-regexp/index.js:220:1 in <global>
- node_modules/path-to-regexp/index.js:133:41 in encodeURI.replace$argument_1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:7595:16 in callCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:7639:19 in commitUpdateEffects
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:7627:22 in commitUpdateQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:17116:10 in commitLifeCycles
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:20002:23 in commitLayoutEffects
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:307:15 in invokeGuardedCallbackImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:531:36 in invokeGuardedCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19768:10 in commitRootImpl
* [native code]:null in commitRootImpl
- node_modules/scheduler/cjs/scheduler.development.js:643:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:19590:4 in commitRoot
* [native code]:null in commitRoot
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18709:28 in runRootCallback
* [native code]:null in runRootCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5642:32 in runWithPriority$argument_1
- node_modules/scheduler/cjs/scheduler.development.js:643:23 in unstable_runWithPriority
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5638:22 in flushSyncCallbackQueueImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:5627:28 in flushSyncCallbackQueue
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:18556:30 in scheduleUpdateOnFiber
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:7799:17 in classComponentUpdater.enqueueSetState
- node_modules/react/cjs/react.development.js:325:31 in Component.prototype.setState
- node_modules/path-to-regexp/index.js:124:1 in <global>
- node_modules/expo-secure-store/build/SecureStore.js:22:7 in setItemAsync
* http://192.168.1.7:19001/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&minify=false&hot=false:207753:48 in _callee$
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:271:30 in invoke
- node_modules/regenerator-runtime/runtime.js:45:44 in tryCatch
- node_modules/regenerator-runtime/runtime.js:135:28 in invoke
- node_modules/regenerator-runtime/runtime.js:145:19 in Promise.resolve.then$argument_0
- node_modules/promise/setimmediate/core.js:37:14 in tryCallOne
- node_modules/promise/setimmediate/core.js:123:25 in setImmediate$argument_0
- node_modules/react-native/Libraries/Core/Timers/JSTimers.js:146:14 in _callTimer
- node_modules/react-native/Libraries/Core/Timers/JSTimers.js:194:17 in _callImmediatesPass
- node_modules/react-native/Libraries/Core/Timers/JSTimers.js:458:30 in callImmediates
* [native code]:null in callImmediates
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:407:6 in __callImmediates
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:143:6 in __guard$argument_0
- ... 2 more stack frames from framework internals

PS:

“expo-firebase-analytics”: “~2.1.0”,
“expo-firebase-core”: “~1.0.0”,
“firebase”: “6.6.1”,

I am no longer receiving the above warning after creating a new WEB app within my Firebase console project (I have both an iOS and a Web app) and using the new WEB app’s firebaseConfig detail that are displayed after creating it:

var firebaseConfig = {
    apiKey: "XX",
    authDomain: "XX",
    databaseURL: "XX",
    projectId: "XX",
    storageBucket: "XX",
    messagingSenderId: "XX",
    appId: "XX",
    measurementId: "XX"
  };

In other words, you don’t need the tag manager, but you need to make sure to follow these steps very closely here: Using Firebase Analytics with Expo | by Hein Rutjes | Exposition

I’m copying it here for anyone who stumbles across this so hopefully it can help them too.

Register iOS and Android apps

If you haven’t built a standalone app yet, now would be a good time to come up with a bundleIdentifier for iOS and a package for Android (more on that here) — you will need these for your Firebase project configuration.

Register a web app

It’s important to also register a web app with your project and keep the web configuration handy because we will need it in the next step. This is used to test Firebase Analytics in the Expo client app and when running your app on the web.

Add the Firebase configuration to app.json

We need to now refer to this configuration on iOS, Android, and web inside of app.json , as follows: NOTE: there are 3 different configurations below, including web

{
  "expo": {
    "ios": {
      "googleServicesFile": "./GoogleService-Info.plist"
    },
    "android": {
      "googleServicesFile": "./google-services.json"
    },
    "web": {
      "config": {
        "firebase": {
          "apiKey": "AIzaXXXXXXXX-xxxxxxxxxxxxxxxxxxx",
          ...
          "measurementId": "G-XXXXXXXXX"
        }
      }
    }
  }
}

Confused? Learn more in the detailed guide on how to setup native Firebase with Expo.

Now my problem is DebugView or RealTime in Google Analytics.
The warning is gone and in console I see

...
FirebaseAnalyticsJS body: en=GOTOSCREEN&_et={--- params ---}
...

However, in both DebugView and RealTime I do not see events.

Within Google Analytics / Admin / Data Streams it says

No data received in past 48 hours.
Stream configurations in Firebase

After checking the settings I looked for enabling debug setting properties like these:

  1. adb shell setprop debug.firebase.analytics.app package_name

  2. Attention: if the app is running with -FIRDebugEnabled it shouldn’t take more than a few seconds for events to start appearing on the DebugView.

  3. Validate your Analytics configuration with DebugView

What could I be missing?

APP+WEB from Firebase appears to still be in Beta…this from December 12, 2019

Hi Adriaan! I’m going to try and help you to get this solved.

I guess you already figured this out, but the standard Expo client uses a different part of the configuration, as compared to the IPA/package deployed to TestFlight. Here are main differences outlined for the generic Expo client vs standalone builds & bare.

Expo Client (iOS & Android) Android APK iOS IPA
analytics Doesn’t use native Firebase SDK, but a custom JavaScript client which requires a valid measurementId Native Android Firebase SDK Native iOS Firebase SDK
config Firebase Web Config google-services.json GoogleService-Info.plist
app.json key expo.web.config.firebase expo.android.googleServicesFile expo.ios.googleServicesFile
rate Events are send to the Google Analytics back-end after max 5 seconds. Rate of Google Play services applies. It can take up to an hour for analytics events to be sent. Triggering a conversion event, causes queued events to be sent to the Google Analytics back-end. Rate of the Firebase iOS SKD applies. Events are typically sent within minutes.
DebugView Not (yet) supported Supported Supported

As for your questions, it seems you managed to fix some issues already. Could you summarize which environment is still not working for you (managed iOS/Android, iOS IPA, Android APK, etc…) ?

Now my problem is DebugView or RealTime in Google Analytics.
The warning is gone and in console I see

FirebaseAnalyticsJS body: en=GOTOSCREEN&_et={--- params ---}

However, in both DebugView and RealTime I do not see events.

Unfortunately DebugView doesn’t yet work in the Expo client. You should however be able to send events. From the log above, it does seem to be sending events to the Google Analytics back-end. It uses the measurementId from app.json expo.web.config.firebase.measurementId, so that has to be a working measurement-id.

Yesterday we found out that certain Android devices don’t seem to record events and we released a fix for that. This problem may also apply here, so could you try upgrading to the latest expo-firebase-analytics (>2.1.2) ?
That version also removes the FirebaseAnalyticsJS body line that was accidentally logged to the console, so don’t worry if you don’t see it anymore.

Hi @ijzerenhein

I’m following this article, which I’ve also linked earlier in this thread

My goal is to test triggering events in both the Expo Client app/simulator and a TestFlight of my app.

I have 2 apps in my Firebase project:

  1. iOS bundle ID (for the TestFlight app)
  2. Web app (for the Expo Client)

For the iOS app I have downloaded the GoogleService-info.plist and ensured that the bundle ID is the same as the iOS app’s bundle ID. I am added the following snippet to my app.json:

 "ios": {
      "supportsTablet": true,
      "bundleIdentifier": "com.my.project",
      "googleServicesFile": "./GoogleService-Info.plist"
    },

For the Web app I copied the config details provided in the settings panel and copied them into the app.json like so:

"web": {
      "config": {
        "firebase": {
          "apiKey": "A----,
          "authDomain": "myproject-6c59f.firebaseapp.com",
          "databaseURL": "https://myproject-6c59f.firebaseio.com",
          "projectId": "myproject-12345",
          "storageBucket": "myproject-12345.appspot.com",
          "messagingSenderId": "myprojectSenderId",
          "appId": "1:my:project",
          "measurementId": "G-myproject"
        }
      }
    },

Inside my React Native JavaScript code I’ve ran

expo install expo-firebase-core expo-firebase-analytics

Today I upgraded to 2.1.2

yarn add expo-firebase-analytics

The console logs have disappeared as you mentioned.

I open my Firebase console and navigate to Analytics StreamView.

To my delight I see a blue pulsing circle on the big map, which is where I am. And I even see 1 event appear on the StreamView graph! BUT uhoh…no more events. I have setup many events similar to the first event that appears in StreamView, but none of those events appear. I’m bewildered.

But wait, there’s more. I don’t see any events for my TestFlight iOS app in StreamView; no real-time events when using my TestFlight app appear (not 1 like it did for the Expo Client)

And in my Firebase Analytics “Latest Release” I only see the iOS app, not the Web app. Which makes this even more perplexing.

Okay so maybe my JS code is missing something…

import * as Analytics from 'expo-firebase-analytics';
Analytics.logEvent(name, payload);

Only thing I can see wrong with this is that I’m sending improper payloads. My payloads are basic, they look like one of these two options:

  1. null
  2. { itemId: "123abc" }

All this to ask:

  1. Why is my “StreamView” not showing more than the 1 event?
  2. Why do I only see 1 app in my “Latest Releases”?
  3. Is this to be expected?
  4. Should I change my payload to a specific data type/struct?

Thanks in advance.

Hi Adriaan.

It seems some progress was made but we’re not there yet. I have also seen that sometimes events are don’t seem to be recorded. I’ve also seen this happen with the regular Firebase JS SDK firebase/analytics (running on web) and it looks like that this is more a Analytics back-end issue. I’ve verified that all events are sent on our side correctly. Also, I’ve been experiencing a lot of connection/load issues with Firebase in general today, so they might be having problem on their back-end. At the moment it doesn’t seem to show any events in the back-end, so I’m not sure what that means…

As for the TestFlight app not working, this might be related to the cloud issues at the moment. But it might also be related to something else. Once the Analytics back-end is running stable again I will run a test with that.

Your configuration looks good btw, considering that the ./GoogleService-Info.plist is correct, it should work for the TestFlight app. The API-call and payloads also look good :+1:

1 Like

Hello Adriaan!

I’ve done some testing with building a TestFlight app and it all worked as expected. There are a couple things to pay attention to though:

  • make sure your iOS project is enabled in the Firebase Console (in Project Overview the “eye” icon needs to be enabled)
  • when recording an event it may take some time before they are sent by the native Firebase SDK. By triggering a conversion event (e.g. a “purchase”), it will give special priority to that event and it typically gets flushed to the back-end immediately.

Then, give the project a name and an ID (the ID must be unique, and one is generated for you from the project name). Read and accept the Firebase terms, and click Continue. In the next step, make sure the “Set up Google Analytics for my project” is checked, and click Continue MyPrepaidCenter