@bouncecode/mrlogin-sdk-rn NPM

Mrlogin-sdk

This SDK helps developers get started with the SSO login service in React-Native provided by Bouncecode.

Installation

npm install @bouncecode/mrlogin-sdk-rn
npm install base-64
npm install buffer

// or

yarn add @bouncecode/mrlogin-sdk
yarn add base-64
yarn add buffer

Set up

In APP.js you need to set encode, decode and buffer.

// App.js

import {decode, encode} from 'base-64';
import {Buffer} from 'buffer';

const App = () => {

if (!global.btoa) {
    global.btoa = encode;
}

if (!global.atob) {
  global.atob = decode;
}

if (!global.Buffer) {
  global.Buffer = Buffer;
}

  //...
}

The entry point to the react-native SDK is a Mrlogin instance that will give you access to its API.

import Mrlogin from "@bouncecode/mrlogin-sdk";

// MrloginOptions { projectId, endpoint, port }  default endpoint = https://mrlogin.io
// projectId :
// 1. go to https://mrlogin.io
// 2. sign up
// 3. Check the project id in url . https://mrlogin.io/manage/{your-project-id}/users/list/

const mrlogin = new Mrlogin({
  projectId: 'your project id', // required.
  endpoint: 'https://mrlogin.io', // optional, default: `https://mrlogin.io`
  port: 'endpoint port' // optional
});

Authentication Flow using Deep Linking

In order to redirect back to your application from a web browser, you must specify a unique URI to your app. To do this, define your app scheme and replace my-scheme and my-host with your info. Please refer to the InAppBrowser documentation. Go to InAppBrowser README.MD

Enable deep linking (Android) - AndroidManifest.xml

<activity
  ...
  android:launchMode="singleTask">
  <intent-filter>
      <action android:name="android.intent.action.VIEW" />
      <category android:name="android.intent.category.DEFAULT" />
      <category android:name="android.intent.category.BROWSABLE" />
      <data android:scheme="my-scheme" android:host="my-host" android:pathPrefix="" />
  </intent-filter>
</activity>

Enable deep linking (iOS) - Info.plist

<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleTypeRole</key>
    <string>Editor</string>
    <key>CFBundleURLName</key>
    <string>my-scheme</string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>my-scheme</string>
    </array>
  </dict>
</array>

login

The login method open InAppBrowser and proceed login. if login success, return an TokenObject

const mrlogin = new Mrlogin({
  projectId: 'your project id', // required.
  endpoint: 'https://mrlogin.io', // optional, default: `https://mrlogin.io`
  port: 'endpoint port' // optional
});

const redirectUri =
  Platform.OS == 'android'
    ? `mrloginrnexample://mrlogin/auth` // android deep link setting (AndroidManifest.xml)
    : `mrloginrnexample://auth`;        // ios deep link setting (Info.plist)

const result = await mrlogin.login(redirectUri);
// login result : TokenObject { accessToken: string, refreshToken: string }

decodeToken

The decode Token method decodes the access token issued after completing login and returns the data included in the access_token. an JwtPayload & AccessTokenData

const mrlogin = new Mrlogin({
  projectId: 'your project id', // required.
  endpoint: 'https://mrlogin.io', // optional, default: `https://mrlogin.io`
  port: 'endpoint port' // optional
});

const token = 'user-access-token';

const data = mrlogin.decodeToken(token);

verifyToken

The 'verify Token' method returns the data included in access_token by verifying and decrypting the access token issued after login on the server. an AccessTokenData

const mrlogin = new Mrlogin({
  projectId: 'your project id', // required.
  endpoint: 'https://mrlogin.io', // optional, default: `https://mrlogin.io`
  port: 'endpoint port' // optional
});

const token = 'user-access-token';

const data = await mrlogin.verifyToken(token);

createDidToken

The 'createDidToken' method issues and returns a did_Token containing a decentralized ID (DID) from the server through an access_token.

The DID token is encoded as a Base64 JSON string tuple representing proof, claim:

proof: A digital signature that proves the validity of the given claim.

claim: Unsigned data the user asserts. This should equal the proof after Elliptic Curve recovery.

const mrlogin = new Mrlogin({
  projectId: 'your project id', // required.
  endpoint: 'https://mrlogin.io', // optional, default: `https://mrlogin.io`
  port: 'endpoint port' // optional
});

const token = 'user-access-token';

const didtokenSolana = await mrlogin.createDidToken(
  'solana',
  token
);

const didtokenEth = await mrlogin.createDidToken(
  'ether',
  token
);

verifyDidToken

The 'verifyDidToken' method verifies and decrypts the did token and returns the data contained in did_token. an IDidToken

const mrlogin = new Mrlogin({
  projectId: 'your project id', // required.
  endpoint: 'https://mrlogin.io', // optional, default: `https://mrlogin.io`
  port: 'endpoint port' // optional
});

const decodeSolanaDidData = await mrlogin.verifyDidToken(didSolana, 'solana');
const decodeEtherDidData = await mrlogin.verifyDidToken(didSolana, 'ether');

token-object

interface TokenObject {
    accessToken: string;
    refreshToken: string;
}

access-token-data

interface AccessTokenData {
    customUserData?: any;
    email: string;
    multiFactor?: string;
    oauthToken?: any;
    passwordUpdatedDate?: Date;
    phoneNumber?: string;
    projectAdmin?: any;
    projectId: string;
    protectedBackupKey?: string;
    protectedShareKey?: string;
    provider: string;
    reported?: Date;
    tokenId?: string;
    userId: string;
    verifiedAt?: Date;
    verifiedEmail?: boolean;
    verifiedEmailAt?: Date;
    verifiedMobileIdentity?: boolean;
    verifiedMobileIdentityAt?: Date;
    verifyInterest?: Date;
    verifySMS?: boolean;
    verifyTerm?: Date;
}

did-token-data

interface IDidTokenAdd {
    tokenId: string;
    protectedKey: string;
}
interface IDidToken {
    iat: number;
    ext: number;
    iss: string;
    sub: string;
    aud: string;
    add: IDidTokenAdd;
    nbf: number;
    tid: string;
}