Easily implement usual security measures in React Native Expo apps
npm install @bam.tech/react-native-app-securityEasily implement usual security measures in React Native Expo apps
- Installation and setup
- Features
- SSL Pinning
- Configuration
- Pinning subdomains
- Generating the public key hashes
- Testing
- Certificate transparency
- Configuration
- Prevent "recent screenshots"
- Configuration
- Safe Keyboard Detector
- [[EXPERIMENTAL - iOS only] Disable Default Caching in Cache.db](#experimental---ios-only-disable-default-caching-in-cachedb)
- Contributing
- 👉 About BAM
> ⚠️ Disclaimer
> This package is intended to help implement a few basic security features but does not in itself guarantee that an app is secure.
> Refer to OWASP's resources for more information on mobile app security.
> You can also contact us if you need help with securing your app.
This package is designed for use in expo apps with development builds.
``sh`
yarn add @bam.tech/react-native-app-security
Add the config plugin to app.config.ts / app.config.js / app.json:
`json`
{
"plugins": [
[
"@bam.tech/react-native-app-security",
{
"sslPinning": {
"yahoo.com": [
"TQEtdMbmwFgYUifM4LDF+xgEtd0z69mPGmkp014d6ZY=",
"rFjc3wG7lTZe43zeYTvPq8k4xdDEutCmIhI5dn4oCeE="
]
},
"preventRecentScreenshots": {
"ios": { "enabled": true },
"android": { "enabled": true }
}
}
]
]
}
Anytime you change the config, don't forget to run:
`sh`
yarn expo prebuild
> 🥷 What's the threat? Attackers intercepting your app's network requests and accessing private data or sending malicious responses. More details
This package implements public key pinning using TrustKit on iOS and the certificate pinner included in OkHttp on Android.
`jsonchttps://
[
"@bam.tech/react-native-app-security",
{
"sslPinning": {
// The hostname you want to pin, without
"yahoo.com": [
// The public key hashes for the pinned certificates, without a prefix`
"TQEtdMbmwFgYUifM4LDF+xgEtd0z69mPGmkp014d6ZY=",
"rFjc3wG7lTZe43zeYTvPq8k4xdDEutCmIhI5dn4oCeE="
]
}
}
]
Please note that you'll need to provide _2_ public key hashes. This is to encourage having proper procedures in place to avoid locking users out, as described here in the TrustKit docs.
#### Pinning subdomains
To pin a specific subdomain, simply include it in the string you provide, eg:
`jsonc`
"sslPinning": {
"subdomain.domain.com": [/ ... /]
}
To pin a domain and all its subdomains, use a wildcard:
`jsonc`
"sslPinning": {
// domain.com and all its subdomains will be pinned
".domain.com": [/ ... */]
}
> The wildcard can only be used for the full lefmost part of the hostname.
>
> These are invalid: domain.com, domain..com, sub.*.domain.com
You'll need the certificates (.cer or .crt)
`sh`
openssl x509 -in certificate.cer -pubkey -noout | openssl pkey -pubin -outform der | openssl dgst -sha256 -binary | openssl enc -base64
To test that SSL pinning is working as expected, you can:
- break (change) a certificate and check that the connection fails _(don't forget to yarn expo prebuild then yarn ios or yarn android to rebuild the app)_
- set up a proxy (we love Proxyman) and check that the connection fails
> 🥷 What's the threat? Compromised certificate authorities. More details
- On iOS, certificate transparency is enabled by default since _iOS 12.1.1_
- On Android, this package enables it using appmatus/certificatetransparency for _Android >= 8.0_
None, enabled by default.
> 🥷 What's the threat? When the OS terminates the app, it may take a screenshot and store it on the device to display in the app switcher. This screenshot could leak sensitive data
Mitigating this threat is achieved by:
- Using FLAG_SECURE on Android < 13
- Using Activity.setRecentScreenshotsEnabled>) on Android >= 13
- Covering the app with the splashscreen on iOS (requires expo-splash-screen to be setup)
`jsonc`
[
"@bam.tech/react-native-app-security",
{
"preventRecentScreenshots": {
"ios": { "enabled": true },
"android": { "enabled": true }
}
}
]
> 🥷 What's the threat? A third-party keyboard might embed a malicious keylogger to record passwords and sensitive data. More details
Mitigating this threat is achieved by:
- On Android, comparing the current keyboard id with a list of keyboard packages that we deem safe.
- On iOS, doing nothing specific since iOS already prevent the use of third-party keyboard on sensitive fields such as passwords.
`tsx
import { SafeKeyboardDetector } from "@bam.tech/react-native-app-security";
const { isInDefaultSafeList, inputMethodId } = getCurrentInputMethodInfo(); // Will always return {isInDefaultSafeList: true, inputMethodId: "iosKeyboard"} on iOS
if (!isInDefaultSafeList) {
console.warn(Your current keyboard (${inputMethodId}) is not safe);
}
// Prompt the user to change the current keyboard
SafeKeyboardDetector.showInputMethodPicker(); // can only be called on Android
`
> 🥷 Threat: On iOS, every NSURL request may be cached by default in Cache.db, potentially storing sensitive data unless explicitly disabled. This can lead to unintentional data leaks.
Mitigating this threat is achieved by:
- Fully clearing the existing cache
- Remove the cache by setting it to an empty cache:
`swift`
URLCache.shared = URLCache(memoryCapacity: 0, diskCapacity: 0, diskPath: nil)$3
If you want to enable this functionality, it need to be enabled in the app configuration file (by default it's disabled)
`jsonc`
[
"@bam.tech/react-native-app-security",
{
"disableCache": {
"ios": { "enabled": true },
}
}
]
Contributions are welcome. See the Expo modules docs for information on how to build/run/develop on the project.
When making a change to the plugin folder, you'll need to run yarn prepare` before prebuilding and building the example app.
We are a 100 people company developing and designing multi-platform applications with React Native using the Lean & Agile methodology. To get more information on the solutions that would suit your needs, feel free to get in touch by email or through our contact form!
We will always answer you with pleasure 😁