I'm trying to implement Face ID in my React Native project.
...
import * as LocalAuthentication from 'expo-local-authentication';
...
componentDidMount = async () => {
const hasAuth = await LocalAuthentication.hasHardwareAsync();
if(hasAuth)
LocalAuthentication.authenticateAsync();
}
...
When I run it in expo expo-start using my phone, it opens the iPhone page where ask for passcode (not faceID). After entering the passcode it returns the warning message below and the Face ID does not work.
FaceID is not available in Expo Client. You can use it in a standalone Expo app by providing `NSFaceIDUsageDescription`
I also added the NSFaceIDUsageDescription to my app.json.
"infoPlist": {
"NSFaceIDUsageDescription": "This app will optionally use Face ID or Touch ID to save login"
}
Expo Local Authentication FaceID doesnt work on expo client app, but you can test it building an archive IPA for IOS. expo build:ios -t archive. It will create a build for IOS and then you can test it.
Related
Below is the steps implemented in React Native code -
Do i have to add any steps or methods in iOS side?
Certificate is APNS enable.
Step 1:
# Install & setup the app module
yarn add #react-native-firebase/app
# Install the messaging module
yarn add #react-native-firebase/messaging
# If you're developing your app using iOS, run this command
cd ios/ && pod install
const getDeviceToken = firebase.messaging().getAPNSToken();
if (getDeviceToken) {
console.log('getDeviceToken:', getDeviceToken);
}
But the result i am getting in console is : { _U: 0, _V: 0, _W: null, _X: null }
Note: I am running the project in Actual iOS device.
Notification permission is already granted.
You need to make it async in order to wait for the token to be fetched from firebase
use async await and it will work
const getDeviceToken = await firebase.messaging().getAPNSToken();
if (getDeviceToken) {
console.log('getDeviceToken:', getDeviceToken);
}
I'm trying to add Facebook SDK for my Android expo app to track the app installs. I've added the code below into StartupScreen.js in useEffect:
const fbEvent = await Facebook.initializeAsync({
appId: "FB_APP_ID",
appName: "FB_APP_NAME",
})
console.log('fbEvent::', fbEvent)
However, the log is showing undefined and there is no app events showing in Facebook.
How can I solve this? Thanks in advance.
I'm trying to open an app at a specific screen, from a push notification. My understanding is that I use a "deep link" to do this. I've set up react-navigation to handle the deep link (and AndroidManifest.xml & appDelegate.m), and can open the deep link with xcrun simctl openurl booted myapp://a/1 / adb shell am start -W -a android.intent.action.VIEW -d "myapp://a/1" app.bundle.name.
But I can't get the push notification to open the app, at the deep link, when the app is closed; it only opens the app on the home screen (on both iOS and Android). How do I get the app to open at the deep link (or alternatively, to read the contents of the push notification so that I can navigate to the correct screen myself)?
library versions:
react-native 0.62.2
#react-navigation 5.5.1
react-native-fcm 16.2.4
After some debugging, I found it was actually a problem in my code handling notifications. I was checking for an ID property in the notification body, but not all notifications have one. So once I removed this, it started working. So to make it work you should have something like:
// push handler component
class PushHandler extends React.Component {
componentDidMount() {
FCM.getInitialNotification(notification => {
if (!notification) {
// the app was not opened with a notification.
return;
}
// extract route from `notification` here
this.props.navigation.navigate(route);
}
}
// ... rest of push notification handling code
}
It also didn't have anything to do with deep linking. The this.props.navigation.navigate is just the plain in-app navigation.
I am creating an APP using managed expo react native.
And want to implement Toast alerts, react-native provides Toast only for Android not for IOS.
I googled it and found the couple of modules which works on Android and ios but they required some config change in Native code. But as I said I am working on Managed expo app. So, I don't have access for that.
Now let me know how I can implement Toast on this?
Thanks.
As toast is a native feature in android, for ios try snakbar.
import {
ToastAndroid,
Platform
} from "react-native";
import Snackbar from 'react-native-snackbar';
notify = (message) => {
if (Platform.OS != 'android') {
Snackbar.show({
text: message,
duration: Snackbar.LENGTH_SHORT,
});
} else {
ToastAndroid.show(message, ToastAndroid.SHORT);
}
}
** If you are on expo
https://snack.expo.io/#mainak/snackbar
You can use third-party library native-base available for both react-native-cli and expo
[Native-Base] https://docs.nativebase.io/docs/GetStarted.html
[Toast Component] https://docs.nativebase.io/Components.html#toast-def-headref
I am using the expo-cli tool to develop in react native. I am using an android simulator: Once i run "yarn start" the console asks me:
To run the app with live reloading, choose one of:
• Scan the QR code above with the Expo app (Android) or the Camera app (iOS).
• Press a for Android emulator.
• Press e to send a link to your phone with email.
• Press s to sign in and enable more options.
I press a. The simulator loads the expo app succesfully but the text displayed is not updated. What i mean with this is that before I just had this on app.js:
export default function App() {
return (
<UtilityThemeProvider>
<Box><Text>Hello App</Text></Box>
</UtilityThemeProvider>
);
}
And indeed it was showing Hello App. But then I installed react navigation and similar dependiencies and i have this on app.js:
export default function App() {
return (
<UtilityThemeProvider>
<Navigation />
</UtilityThemeProvider>
);
}
There is no error showing. Not in the console of the simulator, nor in the console, nor in the metro bundler! But the android simulator still it´s showing Hello App
Here´s how i export and import the Navigator component:
index.js:
export default class Navigation extends Component{
state = {}
render(){
return <AppNavigator />
}
}
App.js:
import Navigation from './src/views/index'
Things i´ve tried:
Restart the simulator device
2- Stop the server and run yarn start again
3- Make sure my IDE is still in autosave mode
Any idea what i could do? Could it be possible that i´ve touched something to disable re-load?
Click on Android simulator Ctrl + M and check if you have Enable Live Reload option