I'm trying to connect firebase first time with my react-native application but facing an issue which is that:
Error: Missing or invalid FirebaseOptions property 'apiKey'. I try to search to solve that problem but it doesn't solve.
import Firebase from '#react-native-firebase/app'
useEffect(()=>{
Firebase.initializeApp()
},[])
dependencies {
classpath("com.android.tools.build:gradle:4.1.0")
classpath 'com.google.gms:google-services:4.3.0'
}
Now according to my searches i do the following things to solve it
clean my android gradlew
Reinstall the node modules
Change the google-services:4.3.10 ->4.3.0
Redownload the google-serives.json file
but it doesn't work for me
I'm not sure if this helps, but I noticed you don't seem to be configuring Firebase.
This is older code from a prior project where I used Firebase (keys changed for anonymity).
Please note:
//Configure Firebase
var app = firebase.initializeApp({
apiKey: "AIzaSyBA-nJOSHcALkHfR7D7GsBqzU5qmCHY_WA",
authDomain: "project-e6136.firebaseapp.com",
databaseURL: "https://project-e6136.firebaseio.com",
projectId: "project-e6136",
storageBucket: "",
messagingSenderId: "948984656115"
});
I think you need to pass an object into the initializeApp(), with your keys.
In my case, I setup these keys at https://firebase.google.com/, when I registered an account.
Hopefully this helps, or please comment, if I misunderstood your question.
Related
i'm using a very simple code and fetching data from firestore
import firebase from 'firebase/app';
import 'firebase/firestore'
const firebaseApp = firebase.initializeApp({
apiKey: "...",
authDomain: "...",
....
});
const db = firebaseApp.firestore();
export default db;
but i keep getting this error
[2021-06-05T00:58:41.274Z] #firebase/firestore: Firestore (8.6.5): Could not reach Cloud Firestore backend. Connection failed 1 times.
Most recent error: FirebaseError: [code=permission-denied]:
Permission denied on resource project.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.
i do have a very fast internet connection
my clock is also synced with the standard time
Now, i have no clue why is this happening?
please someone help me out!!!
I was facing the same issue. The connection was working on some environments, but on my client's corporate network it wasn't.
After a loong research on the internet, I found an issue on Github talking about it.
Here's what worked for me:
const firestoreDB = initializeFirestore(firebaseApp, {
experimentalForceLongPolling: true, // this line
useFetchStreams: false, // and this line
})
Here i'm using firebase v9. For firebase v8 it's something like:
firebase().firestore().settings({
experimentalForceLongPolling: true, // this line
useFetchStreams: false, // and this line
})
i was able to resolve this issue by using my credential directly where i initializeApp my firebase config, i was previously calling them from my env file i think my app was not getting the env before
Make sure your environment is pointing to the real firestone database and not the Firestore Emulator. When I came across this same issue, that was the reason.
I'm using an Angular framework so I had to comment out those environment references in my app.module.ts file.
#NgModule({
declarations: [AppComponent, InformUserComponent],
entryComponents: [InformUserComponent],
imports: [
BrowserModule,
IonicModule.forRoot(),
AngularFireModule.initializeApp(environment.firebaseConfig),
AppRoutingModule,
ServiceWorkerModule.register('ngsw-worker.js', {
enabled: environment.production,
// Register the ServiceWorker as soon as the app is stable
// or after 30 seconds (whichever comes first).
registrationStrategy: 'registerWhenStable:30000'
}),
],
providers: [AuthService, { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
// {
// provide: USE_FIRESTORE_EMULATOR, useValue: environment.useEmulators ?
// ['localhost', 8080] : undefined
// },
// {
// provide: USE_FUNCTIONS_EMULATOR, useValue: environment.useEmulators ?
// ['localhost', 5001] : undefined
// },
],
bootstrap: [AppComponent],
})
export class AppModule { }
I had the same issue and tried to use the #atunde arisekola approach. If you can solve this problem by using direct credentials in your firebaseConfig variable, consider to check whether your .env.local or any other .env you are using is located in the root directory. In my case had firebaseConfig.ts and .env.local in the same directory, and thus the error occured. It is recommended to have.env in the root of your App.
I have faced this issue as well with angular fire.
What I have changed is to add firestore settings to the provider of app module:
According to the GitHub issues discussion, I think you can try experimentalAutoDetectLongPolling first.
And option useFetchStreams is unnecessary except for users who are using very old browser versions.
import { SETTINGS as FIRESTORE_SETTINGS } from '#angular/fire/firestore';
providers:[
{
provide: FIRESTORE_SETTINGS,
useValue: { experimentalAutoDetectLongPolling: true, merge: true },
}
]
and you can use mitmproxy to reproduce the firebase errors.
Is #react-native-firebase/admob deprecated? or just.. Why it doesn't work?
I am using #react-native-firebase/admob (https://rnfb-docs.netlify.app/admob/usage).
Everything works fine before to use "admob()". When I add admob() to the code appears this error:
"TypeError: (0, _admob.default) is not a function"
Do someone know why?
My code below (basic usage):
import React from 'react';
import { Text, View} from 'react-native';
import admob, { MaxAdContentRating } from '#react-native-firebase/admob';
import { InterstitialAd, RewardedAd, BannerAd, TestIds } from '#react-native-
firebase/admob';
import { BannerAdSize} from '#react-native-firebase/admob';
class App extends React.Component{
componentDidMount(){
// this was taked of official page: https://rnfb-docs.netlify.app/admob/usage#installation
admob()
.setRequestConfiguration({
// Update all future requests suitable for parental guidance
maxAdContentRating: MaxAdContentRating.PG,
// Indicates that you want your content treated as child-directed for purposes of COPPA.
tagForChildDirectedTreatment: true,
// Indicates that you want the ad request to be handled in a
// manner suitable for users under the age of consent.
tagForUnderAgeOfConsent: true,
})
.then(() => {
// Request config successfully set!
});
}
render(){
return(
<View style={{
alignItems:"center",
justifyContent:"center",
height:"100%"}}>
<Text style={{color:"black"}}>
Hola
</Text>
<BannerAd
unitId={TestIds.BANNER}
size={BannerAdSize.FULL_BANNER} />
</View>
)
}
}
export default App;
Despite #CodeJoe Answer, I still got confused by different Documentations for the React Native Firebase that where around, hence I spend lots of time and energy to get around it.
I open an issue here where is confirmed that Google removed the AdMob Package since v11.5.0.
AdMob is no longer in Firebase APIs, so this module no longer wraps it, there is no documentation to correct.
However it did exist as recently as v11.5.0 here and if you browse the repository at that point, you may consider the e2e tests for AdMob at the time a primer on "How To Use AdMob" https://github.com/invertase/react-native-firebase/tree/0217bff5cbbf233d7915efb4dbbdfe00e82dff23/packages/admob/e2e
Please, don't be like me and check the correct Documentation and website:
Correct
https://rnfirebase.io
Wrong Wrong Wrong, this refers to an older verison
https://rnfb-docs.netlify.app
The internet has a long memory, so there are stale copies of the docs out and about yes, but rnfirebase.io is always the official and current doc site
Admob was removed completely from the firebase ecosystem by Google so it does not exist here no. There are some community packages for it, our v11.5 version that has it, and we hope to peel our implementation out and update it for the community but it takes time and we are unfortunately still backlogged on official firebase apis, so it has not happened yet
So for AdMob solution I would use another Library, and use react-native-firebase for the Solutions that they currently provide
Alternative Library (August 2021)
DISCLAIMER
React Native Firebase is a great library still for the other packages they provide (Firebase, Analitycs...) and the Admob version 11.5 is still a solution. These are just suggestion for alternatives for Admob.
react-native-admob-alpha Simple and fresh library, recently updated.
react-native-admob-native-ads Another brand new library, they implement Admob Native Advanced Ads.
Expo AdMob (Available also for bare React-Native Projects)
To complete your searching I'll add that Admob is removed from React Native Firebase and there is no plan to implement it again. Only re-host code on an external repository.
Last supported version is 11.5.0
It means if you would like to use RN Firebase Admob before re-host you need to use all other services (like RNF analytics) with this version.
For more info please check https://github.com/invertase/react-native-firebase/issues/5329#issuecomment-843272057
Remember to use
dependencies{
"#react-native-firebase/admob": "11.5.0",
"#react-native-firebase/app": "11.5.0",
}
instead of
dependencies{
"#react-native-firebase/admob": "^11.5.0",
"#react-native-firebase/app": "^11.5.0",
}```
I could solve it.
SOLVED
Just check in the file "package.json" that packages of firebase has the same version, example:
dependencies{
"#react-native-firebase/admob": "^11.5.0",
"#react-native-firebase/app": "^11.5.0"
}
TIP
Works to similars errors.
I am able to use 11.5.0 downgrade trick in react native 0.65.1 for my RewardedAds. I edited the package.json file as said. It didn't work but I managed to run it in a different way:
Close any running react-native related terminals. Uninstall #react-native-firebase/app.
npm uninstall #react-native-firebase/app
Install the #react-native-firebase/app version 11.5.0 directly with this command.
npm install #react-native-firebase/app#11.5.0
After the installation, go to package.json>dependencies and do both packages versions the same(11.5.0) and remove ^.
"#react-native-firebase/admob": "11.5.0",
"#react-native-firebase/app": "11.5.0",
Start the react-native with fresh cache then run-android.
npx react-native start --reset-cache
npx react-native run-android
I am using expo "Bare workflow" in order to connect my react app to firebase.
This is what I have done so far following this tutorial:
I had an existing firebase project which I am trying to connect to.
I clicked on the android icon and registered the app also download the configuration part, I have even added Firebase SDK and applied the plugins, When I use
var admin = require("firebase-admin");
then I get this error:
in my app/build.gradle I do get the following error at:
import com.android.build.OutputFile
the error is: cannot resolve symbol "build"
how can I solve this ?
I also clicked on the file and pressed on invalidate/ cache restart, and I did that too when I click on run on my android studios on the edit configuration window that pops open it tells me Error: AndroidManifest.xml doesn't exist or has incorrect root tag
when I click File->Project structure, there I see under project SDK that no SKD has been selected.
so I am not sure what is causing this problem.
Create your Firebase instance, then go to the left side where it says "Real Time Database" and set that up. Make sure you have react-native-firebase installed (expo install react-native-firebase). Create a config.js file that looks like this:
import Firebase from 'firebase';
let config = {
apiKey: '',
authDomain: '',
databaseURL: '',
projectId: '',
storageBucket: '',
messagingSenderId: ''
};
let app = Firebase.initializeApp(config);
export const db = app.database();
Fill this in with your information, which can be found in the firebase console after creating a web app for your firebase project. (</> button).
Now that you have your firebase linked to your expo project, import your database using import { db } from '{path to your config file}';
Let me know if you need help pushing and pulling data from your RTDB instance.
I created ionic 3 app with firebase
the application start correctly, and connected to firebase DB.and can perform CRUD operations.
when I deploy app using command
$ ionic cordova build --release android
I got error message:
No matching client found for package name 'io.ionic.starter'
note: the file 'google-services.json' is missing
and my app is not shown inside Firebase console pic
I initialize firebase inside app module:
// Initialize Firebase
var config = {
apiKey: "AIzaSyDGJaayYxyasdufYG7GKo36nUMdsfU",
authDomain: "firedo-3997a.firebaseapp.com",
databaseURL: "https://firedo-3997a.firebaseio.com",
projectId: "firedo-3997a",
storageBucket: "firedo-3997a.appspot.com",
messagingSenderId: "578088897558"
};
firebase.initializeApp(config);
please help me deploying this app
You need to add a google-services.json file to the root file of your ionic project from firebase.
And you must make the in the config.xml file like the name of your project in firebase.
I have an android project which I want to expand with Firebase.
Currently I've got an error logging when I want to test a crash with a log message.
Server did not receive report: Origin Error message: API key not valid. Please pass a valid API key.
What can I do to fix this?
I've copied the google-services.json file to my project from the console.
Got the same error in my Angular project. I know the question is for android but this is the question that pops up when I searched the error for angular so hopefully, it would help another person in the near future.
Make sure you're importing the right variable. In the app.module.ts file:
import { FIREBASE } from 'src/environments/firebase';
imports: [
AngularFireModule.initializeApp(FIREBASE.firebase)
],
firebase.ts (environment file) fill with your config info from firebase.
export const FIREBASE = {
production: false,
firebase: {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
measurementId: ""
}
};
So make sure you're importing the right variable. Took me some time to figure out. Happy coding!
Make sure you've got the API keys set correctly in your Google Developer Console for your Firebase project.
There are two different configurations for release mode and test mode. make sure that you use the API key which is related to each. In the angular there are two environment files. environment.prod.ts which is for production and environment.ts which is for testing. make sure that the api key in these files are correct.
good night, I solved this problem with
npm i firebase --save