React Native project with push notifications, I use this.
I follow this tutorial.
I only need local notifications. But if I run this project I get an error default firebaseapp is not initialized in this process.
I follow this answer and get a google service.json from firebase to make it start (notification don't show up unfortunately). But is this also possible without firebase?
requestPermissions: Platform.OS === 'ios', This line you have to add
import { Platform} from 'react-native';
PushNotification.configure({
onRegister: function (token) {
console.log("TOKEN:", token);
},
onNotification: function (notification) {
console.log("NOTIFICATION:", notification);
},
permissions: {
alert: true,
badge: true,
sound: true,
},
popInitialNotification: true,
requestPermissions: Platform.OS === 'ios',// This line you have to add //import Platform from react native
});
This package does work without firebase, after installing and setting up clear gradle cache.
On Windows:
gradlew cleanBuildCache
On Mac or UNIX:
./gradlew cleanBuildCache
Yes, it is possible to push local notification without firebase. I implemented it in one of my projects. You can take reference from this comment.
And also you don't have to call register methods from example which is available in react-native-push-notifications repo.
PS: As author did not marked any of the above answers as resolved. I hope this will work.
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.
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 am trying to get current country of device in but didn't find anything. Is there something to do so in React Native?
I tried using react-native-device-info but it is also not supporting but in previous version it can be get by getDeviceCountry(). Now for the latest version it is showing error:
TypeError: _reactNativeDeviceInfo.default.getDeviceCountry is not a
function. (In '_reactNativeDeviceInfo.default.getDeviceCountry()',
'_reactNativeDeviceInfo.default.getDeviceCountry' is undefined)
According to the documentation of react-native-device-info for latest version, they have moved some of their apis to react-native-localize to reduce duplication in the react-native-community modules. react-native-localize worked perfectly for me.
Setup:
$ npm install --save react-native-localize
# --- or ---
$ yarn add react-native-localize
Usage:
import * as RNLocalize from "react-native-localize";
console.log(RNLocalize.getLocales());
console.log(RNLocalize.getCurrencies());
console.log(RNLocalize.getCountry());
console.log(RNLocalize.getCalendar());
console.log(RNLocalize.getTemperatureUnit());
console.log(RNLocalize.getTimeZone());
console.log(RNLocalize.uses24HourClock());
and many more. For detailed description please visit their official documentation by the given link: react-native-localize
Its solved my problem;
BREAKING CHANGE: remove is24Hour, getTimezone, isAutoTimeZone and isAutoDateAndTime, getDeviceLocale, getDeviceCountry, getPreferredLocales
This was the result of a survey. It removes API duplication in the react-native-community modules
Related PR: https://github.com/react-native-community/react-native-localize/pull/65
Use yarn add
https://github.com/mikehardy/react-native-localize.git#e062f0d2dc3171dc18fdb7b7139d347ad03933dc to maintain
isAutoTimeZone + isAutoDateAndTime until merged
The accepted answer didn't work for me, maybe due to https://github.com/zoontek/react-native-localize/issues/81.
However, Expo has something from its ecosystem, which worked out perfectly:
expo install expo-localization
import { getLocales } from 'expo-localization';
console.log(getLocales()[0].regionCode);
Edit: docs here https://docs.expo.io/versions/latest/sdk/localization/#localizationregion
Looks like it's a bug in the React Native. Please check their Troubleshooting section
Here is what they advice:
Seems to be a bug caused by react-native link. You can manually delete
libRNDeviceInfo-tvOS.a in Xcode -> [Your iOS build target] -> Build
Phrases -> Link Binary with Libraries.
Please use this package to get device country . to has different type of configs.
react-native-device-country
Some Examples
import DeviceCountry, {
TYPE_ANY,
TYPE_TELEPHONY,
TYPE_CONFIGURATION,
} from 'react-native-device-country';
DeviceCountry.getCountryCode()
.then((result) => {
console.log(result);
// {"code": "BY", "type": "telephony"}
})
.catch((e) => {
console.log(e);
});
DeviceCountry.getCountryCode(TYPE_TELEPHONY)
.then((result) => {
console.log(result);
// {"code": "BY", "type": "telephony"}
})
.catch((e) => {
console.log(e);
});
DeviceCountry.getCountryCode(TYPE_CONFIGURATION)
.then((result) => {
console.log(result);
// {"code": "BY", "type": "config"}
})
.catch((e) => {
console.log(e);
});
I try to use phonegap-plugin-push 2.x. Registration event fires correctly in browser and in PhoneGap Developer app but nothing happens in application obtained from build.phonegap.com. Init is pastedet in deviceready part of code. I'll appreciate any suggestions.
<!--Initializing Push Notification-->
const push = PushNotification.init({
android: {
senderID: "12345....." // the same without this line
},
browser: {
pushServiceURL: 'http://push.api.phonegap.com/v1/push'
},
ios: {
alert: "true",
badge: true,
sound: 'false'
},
windows: {}
});
push.on('registration', function(data) {
obj.regid = data.registrationId;
alert(data.registrationId); // no alert in built app
});
Have you included google-services.json, as required by version 2+ of the push plugin?
I am using create-react-native-app. I want to use react-native-vector-icons
But its not showing anything on android screen (I am viewing it on expo app)
Here is what I did:
App.js:
const Courses = TabNavigator({
ReactCourses: { screen: ReactCourses },
NativeCourses: { screen: NativeCourses },
}, {
tabBarOptions: {
activeTintColor: '#e91e63',
swipeEnabled: true,
showIcon:true,
},
});
ReactCourses.js:
import Icon from 'react-native-vector-icons/MaterialIcons';
static navigationOptions = {
tabBarLabel: 'React Courses',
tabBarIcon:({ tintColor }) => (
<Icon
name={'home'}
size={26}
style={[styles.icon, {color: tintColor}]} />
)
}
Add the following things in android/app/build.gradle
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
And then execute the command
react-native run-android
When using Create React Native App, it's not possible to use react-native link with native module packages. Because CRNA projects are loaded in the Expo client app, you'll want to follow the relevant documentation to get vector icons working in your project.
Also, make sure that you're using the Expo preset in .babelrc. It should look like the one provided in the template project.
I think what you did is just a half thing, so after running npm install did you link the project with the third party's native code by running react-native link? if yes, did you rebuild the project by going to android studio and hit play button?if yes then just restart your packager and we are good to go...
Cheers :)