Background
I have an almost finished webapp already working with the following stack
Firebase
React/TypeScript
Context
I'm adding Capacitor to my WebApp so I have a native app where I can send push notifications, and have presence in App Store, Google Play Store. The application already works on its web version, so there is no rule (Real Time Database, FireStore, etc) problem, no credentials problems at all on its web version, all well tested.
Problem
I've added Authentication to my application via Firebase Authentication, which works well, and I have also connected the Native iOS version to it, as it's described in the documentation
Auth flows works fine, User/Password & Google sign up are working fine and actually triggering the methods like onIdTokenChange and OnAuthStateChange from the official Firebase Auth library, in both cases, iOS and WebApp, and also the OnAuthStateChange from the Capacitor plugin (in both clients too).
The problem is that the Firebase JS library remains somehow in a unauthenticated state, where any call to FireStore, Database, or Storage, ends up in "Permissions Denied" error (Only on iOS). Once the Token ID has changed, I can see that currentUser is NULL, and the "signed in user" is not propagating to the Firebase official library from the Capacitor Plugin.
Once I have connected the Capacitor Firebase Authentication plugin, I was expecting that the Firebase official JS library was going to be updated, I've also used Firebase Authentication with IndexedDB local persistence as follows (when being in Native) as follows:
export const Authentication = Capacitor.isNativePlatform() ? initializeAuth(FirebaseApp, {
persistence: indexedDBLocalPersistence
}) : getAuth(FirebaseApp);
Related
I try to get App Check working in my vue.js pwa. Using the latest firebase sdk and by following steps here https://firebase.google.com/docs/app-check/web/recaptcha-provider
My api key (https://console.cloud.google.com/apis/credentials/key..) is not limited to any API restrictions. I did add some Application Restrictions on https tho including my project domains.
Everything works fine till i activate appCheck with recaptcha v3 and i get following console errors:
FirebaseError: [code=unknown]: Fetching auth token failed: AppCheck: Fetch server returned an HTTP error status. HTTP status: 403. (appCheck/fetch-status-error)
Further more the app can't get any firebase data or auth. I tried in several browsers and without any vpn stuff.
In my already installed pwa the App Check error occurs but connection to firebase still works..
Without App Check activated it both works without an issue. Also with an App Check debug token the whole thing just works. I don't understand why it breaks firebase connection even if i haven't enabled enforcement.
I appreciate any tips on how to solve this.
I found the problem i accidently left self.FIREBASE_APPCHECK_DEBUG_TOKEN = true; in my production code.
Remove this line or only use when in development envirement solved the whole problem
if (location.hostname === "localhost") {
self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
}
I didn't expect this line to impact browsers where i haven't registered a debug token to fail with the regular appCheck but of course it doesn't make sense to use it in production anyways.
Based on your question, you want to enable Firebase App Check for Firestore with Web Application. Currently, Firestore App Check does not support it.
As per this Documentation:
Cloud Firestore support is currently available only for Android and iOS clients. If your project has a web app, don't enable Cloud Firestore enforcement until web client support is available.
I'll leave an answer for people who have problems with the setup. For the more detailed answer, you can check this question.
In short, you need to do a few steps.
Set up a firebase.
Go to how to set up app check.
Register reCAPTCHA here and add the secret_key to the Firebase console, and the site_key to your web code.
Initialize the Firebase in your code based on how to set up app check docs.
Get your debug_key and add it to your firebase console and code.
Finally, the code should look something like this:
Don't forget to save your key to a .env file or firebase.js or somewhere where you won't upload it to git.
if (!process.env.NODE_ENV || process.env.NODE_ENV === 'development') {
window.FIREBASE_APPCHECK_DEBUG_TOKEN = 'your_debug_token';
}
const appCheck = initializeAppCheck(app, {
provider: new ReCaptchaV3Provider('your_site_key_from_register'),
// Optional argument. If true, the SDK automatically refreshes App Check
// tokens as needed.
isTokenAutoRefreshEnabled: true
});
I have been trying and searching various methods to make Firebase Phone Auth to work in my flutter application. (There is an open issue talking about conflicts between Firebase Cloud Messaging & Firebase Phone Auth, but I am unsure if my issue is related to that. I do use Firebase Cloud Messaging which works perfectly fine.).
In iOS simulator, whenever I call FirebaseAuth.instance.verifyPhoneNumber, my app opens a web page for reCAPTCHA workflow, and returns back to the app. Then I see the error logs like below in verificationFailed callback. (It is expected to follow reCAPTCHA flow for iOS Simulator according to Firebase Phone Auth Doc)
flutter: Instance of 'AuthException'
flutter: {"error":{"code":403,"message":"Requests from this ios client application <empty> are blocked.","errors":[{"message":"Requests from this ios client application <empty> are blocked.","domain":"global","reason":"forbidden"}],"status":"PERMISSION_DENIED"}}
It is suspicious that error message is using <empty> as my application name, instead of my real app name (or default firebase app name which is __FIRAPP_DEFAULT), but I am unsure why that is happening.
In real iOS device, whenever I call FirebaseAuth.instance.verifyPhoneNumber, the app invokes verificationFailed callback again and I get the error with verifyPhoneNumberError as code and Token mismatch as error message. This is happening in both debug build as well as in release build.
I am using following SDK & library versions.
Flutter SDK = 1.12.13+hotfix.5
firebase_core = 0.4.3
firebase_auth = 0.15.4
firebase_messaging = 6.0.9
Has anyone been able to get Firebase Auth Phone auth working in iOS? I am stuck in this limbo state because I cannot seem to search any info online related to this. I have setup iOS APN, GoogleService-info.plist, Google Cloud Credentials multiple times so far with no luck. (Given that Firebase Cloud Messaging works perfectly fine, I doubt it is an issue with credentials or APN setup.)
Answering my own question since I figured out the root cause.
In Google Cloud Project that is connected to Firebase, I was able to find a set of API Keys that were created by Firebase.
https://console.cloud.google.com/apis/credentials
For each App you define and create in Firebase, a new API key will be auto-created in the API key section. In my case, there was one for 'iOS key (auto created by Firebase)' and another for 'Android key (auto created by Firebase)'.
Well, by default, they do not impose any restrictions and you see a yellow triangle next to the key. So I added restrictions to those keys so that they can only be useable in my app. This is done by setting Application restrictions with corresponding bundle id for iOS and another app id for Android within each API key detail page.
This restriction was actually the reason that Phone Auth has not been working in my apps. Once I reverted the change back to None, I no longer encountered Token mismatch or AuthException.
Ideally, I should restrict these API keys to my app only, but it seems like my Flutter app is unable to prove its identity/appId/bundleId to google services, and Google had been rejecting requests from my App. This must be why I was seeing Requests from this ios client application <empty> are blocked. error message.
For now, everything is working because there is no restriction, but I will need to figure out why my app and its id association is not working as expected sooner than later, so that I can add restriction back.
I have developed an application using android studio. It is already published in the google play store.
This application uses the Firebase FCM service for push notifications.
During the development stage, this worked perfectly. But since the publication in the play store, the SendMessageNotification function is not executed in the firebase backend (Firebase functions).
I have entered the api key in the console, as shown:
.
However, the service continues without running.
Have I skipped a step?
Have you gone through the firebase launch checklist?
Specifically, have you remembered to add the production certificate for your app as well as the development certificate? From the above page "Add a release SHA1 fingerprint for Android apps in the Firebase console (for OAuth client IDs)."
I don't know if this affects client messaging or not.
I have a react native project that is already connected to my firebase project. I use firebase as my database. Everything works great. But...
I am trying to get a simple firebase cloud messaging test to work with my react native android app. As I said, I already have firebase in use with my app for db purposes and for authentication.
I am using the react-native-firebase package (http://invertase.io/react-native-firebase) to do all my firebase work. I followed the directions on their site to get the messaging to work, but I haven't had any success.
I have followed the installation directions here: http://invertase.io/react-native-firebase/#/installation-android
All the database stuff works fine, but no luck with messaging. I am sending out test notifications using the firebase notifications console. I get the firebase token using this code in my app.
firebase.messaging().getToken()
.then((token) => {
firebase.database().ref(user.providerData[0].uid+'/agents/'+user.providerData[0].uid+'/fcmToken').set(token);
});
That code successfully gets the token and saves it to my firebase database. I then copy the token manually from my db and use it in my firebase notification console to send out a test notification. I know that the app is supposed to be running in the background. To get my app in the background I simply hit the home button. Then I send my test message. I don't get any errors in the firebase notification console and it says my token I supplied is all good. After a few seconds it says the notification status is completed. However in my app, nothing appears in my system tray, no notifications.
Does my app have to be in production mode or something? Anyone else get react-native-firebase to work with firebase cloud messaging on android?
I use the firebase console to send test messages
I have a React Native App in which I use Firebase for database and authentication. I use custom authentication with Firebase where I generate a token on my server side code and pass on the token to the client and the client authenticates itself using signInWithCustomToken method. Earlier, we could specify an expiry period for the token and I could use the same token again and again. This was then changed in a later version to have an expiry period of one hour after being issued and it was mentioned that the Firebase SDK will make sure to maintain connections and the user wouldn't need to do the authentication again and again. I recently saw that in v3.6.2, there was some fixes to the authentication for react native
Fixed an issue that prevented user authentication states from
persisting when using Firebase Authentication with React Native
versions 0.37 and higher.
I am using the latest v3.6.6 at the moment. I still see that the user is authenticated every now and then when the app is foregrounded. I wanted to know how does authentication with firebase in react native apps work. The user will put the app in the background at which point it would be suspended by the phone OS or even killed in some conditions. When the user put the app in foreground again, should I expect that the Firebase SDK would make sure that the connection to firebase stays on or would it authenticate with firebase again?