React Native Document Scanner SDK - Getting Started
Installation
The Scanbot SDK module is available as an npm package.
You can simply add it to your project with npm install:
npm install --save react-native-scanbot-sdk
React Native Autolinking
Since version 4.0 react-native-scanbot-sdk
requires React Native v0.60 or higher, which supports the
Autolinking feature.
So "react-native link" should not be used anymore.
Please unlink
the native dependencies of react-native-scanbot-sdk
if you are migrating from a previous version
to react-native-scanbot-sdk@4.x
.
Permissions
In order to operate correctly an application that utilizes ScanbotSDK module must have all required permissions to your App. Here is a listing of those permissions:
Android (must be added in your android/app/src/main/AndroidManifest.xml
file)
<uses-permission android:name="android.permission.CAMERA" />
- This permission is used for the camera views.<uses-feature android:name="android.hardware.camera" />
- Camera hardware features.
iOS (must be added in your Info.plist
file)
NSCameraUsageDescription
- "Privacy - Camera Usage Description". Describe why your app wants to access the device's camera.
Android Setup
Scanbot SDK Maven Repositories
This React Native module depends on the native Scanbot SDK for Android.
The Scanbot SDK for Android is distributed through our private Maven repositories.
Please add these repositories in your android/build.gradle
file in the section allprojects > repositories
:
allprojects {
repositories {
mavenLocal()
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
url "$rootDir/../node_modules/react-native/android"
}
google()
jcenter()
// Scanbot SDK Maven repositories:
maven { url 'https://nexus.scanbot.io/nexus/content/repositories/releases/' }
maven { url 'https://nexus.scanbot.io/nexus/content/repositories/snapshots/' }
}
}
Add SDK Project Reference
As of react-native
v0.62
, Scanbot SDK reference needs to be included at the bottom of your settings.gradle
,
after the :app
module and the React Native related configurations, as such:
...
include ':app'
include ':react-native-scanbot-sdk'
project(':react-native-scanbot-sdk').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-scanbot-sdk/android/app')
Tuning the Android Manifest
Since your application will work with high-resolution images,
it is strongly recommended to add the property android:largeHeap="true"
in the <application>
element of your android/app/src/main/AndroidManifest.xml
file,
especially for Android <= 7.x.
Processing hi-res images is a memory intensive task and this property will ensure
your app has enough heap allocated to avoid OutOfMemoryError
exceptions.
<application ... android:largeHeap="true">
...
</application>
iOS Setup
Please note that since version 4.0 of react-native-scanbot-sdk
the iOS integration can be done only via CocoaPods.
The iOS SDK comes in various bundles:
NONE
(or default): the default SDK bundle with no additional dataOCR
: Default OCR data bundleScanbotSDKOCRData.bundle
containing default language files for DE and ENMRZ
: MRZ Scanner data bundleScanbotSDKMRZData.bundle
MLDETECT
: ML-based Document detectionALL
: All available bundles
If you want to go with the default NONE
bundle, you don't have to do any further configuration, since React Native Autolinking will take care of that for you.
However, if you need additional bundles, you have to disable autolinking and include the pods manually.
To disable autolinking, create a react-native.config.js
file in your project folder and paste the following content:
module.exports = {
dependencies: {
'react-native-scanbot-sdk': {
platforms: {ios: null},
},
},
};
Then you can include the desired subspecs/bundles in your ios/Podfile
:
- Example for
MRZ
subspecs/bundle:
pod 'RNScanbotSDK/MRZ', :path => '../node_modules/react-native-scanbot-sdk'
- Example to include all bundles -
ALL
subspecs:
pod 'RNScanbotSDK/ALL', :path => '../node_modules/react-native-scanbot-sdk'
NOTE for RN < v0.62 and react-native-scanbot-sdk < v4.1.0:
For versions older than v0.62
of react-native
and v4.1.0
of react-native-scanbot-sdk
, you have to link the SDK manually, even if you only want the default bundle. You can add the RNScanbotSDK
pod in your ios/Podfile
:
pod 'RNScanbotSDK', :path => '../node_modules/react-native-scanbot-sdk'
This is equivalent to installing the NONE
bundle.
Installing the Pods
When you are done, you can then install the pods:
$ cd ios/
$ pod install --repo-update
That is it! Just open
the Xcode workspace (.xcworkspace
) and you should be able
to build the native Scanbot SDK linked via CocoaPods.
The following screenshot shows the proper setup of the pod RNScanbotSDK
with the resolved dependency to the pod ScanbotSDK
via CocoaPods using the subspec ALL
:
Want to scan longer than one minute?
Generate your free "no-strings-attached" Trial License and properly test the Scanbot SDK.
Get your free Trial LicenseWhat do you think of this documentation?
What can we do to improve it? Please be as detailed as you like.