I have an expo app and tried to add Firebase support to use their remote-config service. I am testing it in this code
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { getRemoteConfig } from "firebase/remote-config";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "aaaaaaaaaaaaaaaaaaa",
authDomain: "bbbbbbbbbbbbbbbb",
projectId: "ccccccccccc",
storageBucket: "ddddddddddddddddddddddddddd",
messagingSenderId: "eeeeeeeeeeeeeeeee",
appId: "fffffffffffffffffffff",
measurementId: "gggggggggggggggggg"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
export const config = getRemoteConfig(app);
config.settings.minimumFetchIntervalMillis = 3600000;
config.defaultConfig = {
"test": "Welcome222222"
};
config.getValue("test");
But when i try to run it in Expo Go on Android emulator, i get
FirebaseError: Remote Config: Indexed DB is not supported by current browser (remoteconfig/indexed-db-unavailable)
Is there a way to not use any Indexed DB? I thought that the library would just let me use the remote config REST api confortably and i could just send requests, i have no need for any DB in this case.
Related
Why do I have the error that it says invalid API keys?
This is the sample .env.local
REACT_APP_apiKey=AI**************JmXMKaFQQQrRzp4Q
REACT_APP_authDomain=sample-258a7.firebaseapp.com
REACT_APP_projectId=sample-258a7
REACT_APP_storageBucket=sample-258a7.appspot.com
REACT_APP_messagingSendearId=
REACT_APP_appId=1:1014069435807:web:04390779a92d4e3a4fb1aa
In another file:
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import { getAuth, GoogleAuthProvider, onAuthStateChanged } from "firebase/auth";
project under its own project settings
const firebaseConfig = {
apiKey: process.env.REACT_APP_apiKey,
authDomain: process.env.REACT_APP_authDomain,
projectId: process.env.REACT_APP_projectId,
storageBucket: process.env.REACT_APP_storageBucket,
messagingSenderId: process.env.REACT_APP_messagingSenderId,
appId: process.env.REACT_APP_appId,
};
//Initializing Firebase
const app = initializeApp(firebaseConfig);
This is the error:
The Package.json:
Make sure your .env.local is placed in the root directory, and not in any subfolders like src or public. Other than that, nothing seems to be wrong with your code. Just to be safe, cross check your API key with firebase.
P.S. There's no need to hide your firebase public API key, its going to be visible in your app to the general public anyway.
This question already has answers here:
Firebase Analytics with Next.js - window not definded
(2 answers)
Closed 8 months ago.
So I am receiving this error when I run "yarn dev" in the projects directory.
code (firebaseConfig.js):
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { getAuth } from "firebase/auth";
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey:
authDomain:
databaseURL:
projectId:
storageBucket:
messagingSenderId:
appId:
measurementId:
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
const auth = getAuth();
export { auth }
Does anyone know why?
if anyone is wondering, i just deleted my analytics and then it worked, don't even know why i got that error
This question already has answers here:
Module not found: Error: Package path . is not exported from package
(10 answers)
Closed 10 months ago.
I am trying to use firebase inside my project but the classes related to firebase are not getting imported.
This is what I did till now:
Created a new project in firebase console
ran the commands, npm install -g firebase-tools, npm install firebase-admin --save and npm install --save firebase
Created a new file called firebase.js in my project and added the following code:
import firebase from "firebase"
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyAdjdq8JsRSWKeHQYCHNzXm8nn29cOh-4s",
authDomain: "ig-reels-a9b15.firebaseapp.com",
projectId: "ig-reels-a9b15",
storageBucket: "ig-reels-a9b15.appspot.com",
messagingSenderId: "1018616208158",
appId: "1:1018616208158:web:bb1026f5301bd9294e070f",
measurementId: "G-W3051LNHFL"
};
const firebaseApp = firebase.initializaApp(firebaseConfig)
const db = firebaseApp.firestore()
export default db
I am using db variable to pull out data from the cloud firestore database like this:
import React, {useState, useEffect} from "react"
import './App.css';
import VideoCard from './VideoCard';
import db from "./firebase";
function App() {
const [reels, setReels] = useState([])
useEffect(() => {
db.collection("reels").onSnapshot(snapshot => {
console.log(snapshot.docs.toString())
setReels(snapshot.docs.map(doc => doc.data()))
})
}, [])
Whenever I run this code I get the following error:
Compiled with problems:
ERROR in ./src/firebase.js 3:0-32
Module not found: Error: Package path . is not exported from package C:\Users\Aditya\Documents\reactjs-practise\reels_clone\node_modules\firebase (see exports field in C:\Users\Aditya\Documents\reactjs-practise\reels_clone\node_modules\firebase\package.json)
Did you mean './firebase'?
Requests that should resolve in the current directory need to start with './'.
Requests that start with a name are treated as module requests and resolve within module directories (node_modules, C:\Users\Aditya\Documents\reactjs-practise\reels_clone\node_modules).
If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too.
I have successfully installed all the firebase related tools. Why am I getting this error?
First, install firebase then You want to create your own firebase.js file. I am give you the example of
firebase.js
import firebase from 'firebase/app';
import 'firebase/firestore';
const firebaseConfig = {
apiKey: "apiKey",
authDomain: "authDomain",
projectId: "projectId",
storageBucket: "storageBucket",
messagingSenderId: "messagingSenderId",
appId: "appid"
};
firebase.initializeApp(firebaseConfig);
export default firebase;
App.js
const db = firebase.firestore();
//write you own code
So, basically i am trying to save data in firebase an am getting the error "firebase is not defined"
my code:-
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.0.1/firebase-app.js";
const firebaseConfig = {
apiKey: "",
authDomain: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: ""
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
firebase // getting error over here
.firestore()
.collection("books")
.add({
title: "Of Mice and Men",
})
.then((ref) => {
console.log("Added doc with ID: ", ref.id);
// Added doc with ID: ZzhIgLqELaoE3eSsOazu
});
Since version 9 of its JavaScript SDK, Firebase has switched to a new modular syntax where you import individual functions. You'll have to choose whether you want to use the new syntax, or continue using the previous syntax through its compatibility layer.
To import the compatibility libraries, use:
// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
To then switch to the new syntax, follow the instructions in the same upgrade guide, and in the v9 tab of the code samples in the rest of the documentation.
I'm getting auth-domain-config-required errors when using firebase.auth().signInWithPopup(provider).
I've tried with Google and Facebook. I've tested on my hosted site, and it works fine. You can test it live: Quiver Chat Demo
I suspect there's a problem with localhost:3333... does it not like my port? I can't add a port to the Authorized domains list, and adding it to my authDomain: config doesn't help either.
Here's my auth code, but as you can see from the screenshots below, I tried a bunch of different authDomain values.
<script src="https://quiver-four.firebaseapp.com/__/firebase/4.6.2/firebase-app.js"></script>
<script src="https://quiver-four.firebaseapp.com/__/firebase/4.6.2/firebase-auth.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "AIzaSyCzNxnQ6WCJKejq6SBd7NqhVskxEOmDq_Y",
authDomain: "quiver-four.firebaseapp.com",
databaseURL: "https://quiver-four.firebaseio.com",
projectId: "quiver-four",
storageBucket: "quiver-four.appspot.com",
messagingSenderId: "1082528354495"
};
firebase.initializeApp(config);
</script>
Attempting localhost:3333
Attempting localhost
Attempting quiver-four.firebaseapp.com
The domains are added
You must not be providing the correct authDomain in your Firebase app initialization configuration.
You can get that web snippet from the Firebase Console. The authDomain has the form projectName.firebaseapp.com.
I had the same problem and my solution was to have a file in the root firebase.js with all the connection configuration:
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import {getAuth} from 'firebase/auth'
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "xxxxxxx_xxx_R-xxx-CDxxxxcg",
authDomain: "qxxxxxx-xxxx.firebaseapp.com",
projectId: "xxxxxx-xxxxx",
storageBucket: "xxxxxxx-xxxx.appspot.com",
messagingSenderId: "xxxxxxx",
appId: "1:xxxxxxx:wxb:xxxxxxxxxxxxxx",
measurementId: "G-xxxxx"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
export const db = getFirestore(app);
export const auth = getAuth(app);