CyberSiARA™ | React Native

Home

Get Started

Integration

User Portal

React Native Integration Guideline
  • If the first step is already integrated into your project, please skip it and proceed to the second step.
  • 1. Prerequisites
  • This step is for .env file setup in your project for dynamic public and private keys set.
  • Run: 'npm install react-native-dotenv'
  • For further guidance, please follow the additional instructions provided at this link: Click Here
  • 2. Installation Siarashield library
  • Run: 'npm install --save react-native-siarashield'
  • OR
  • yarn add react-native-siarashield
  • For further guidance, please follow the additional instructions provided at this link: Click Here
  • 3. React native dev info library is required to get the device information.
  • Run : npm install react-native-device-info
  • OR
  • yarn add react-native-device-info
  • For further guidance, please follow the additional instructions provided at this link: Click Here
    •
  • 4. Android manual Installation
  • To take Permission from User for get device ID.
  • Add this permission in your android/app/src/main/AndroidManifest.xml file
  • <uses-permission android:name="android.permission.READ_PHONE_STATE"/>;
  • 5. Add this below line in the android/build.gradle file.
    • implementation 'com.facebook.fresco:fresco:1.+'
    
implementation 'com.facebook.fresco:animated-gif:2.6.0'
  • 6. Get your public & private key from mycybersiara.com
    •
  • 7. Usage
  • Import siarashield package in your screen.
    • import CyberSiaraCaptcha from 'react-native-siarashield';
import envs from '../Config/envs';
     
    <CyberSiaraCaptcha
  isLogin={isLogin}   // Example: isLogin = {isRegister}
  PUBLIC_KEY={envs.PUBLIC_KEYS.PUBLIC_KEY}
  PRIVATE_KEY={envs.PRIVATE_KEYS.PRIVATE_KEY}
  loginVisible={data => loginVisible(data)}
/>
  • OR
    •
  • If you have not setup the .env file so use this example.
    • <CyberSiaraCaptcha
    isLogin={isLogin}   // Example: isLogin = {isRegister}
    PUBLIC_KEY={'your public key'}
    PRIVATE_KEY={'your private key'}
    loginVisible={data => loginVisible(data)}
/>
    • Once all these steps are done, run your project and enjoy the SiaraShield.
    • If you have any queries, please follow the steps in this video for easy management.

    • Thank you for using SiaraShield!