otpless-ionic
v1.0.7
Published
Otpless ionic plugin support for android and ios apps
Downloads
76
Readme
otpless-ionic
Otpless ionic plugin support for android and ios apps
Install
npm install otpless-ionic
npx cap sync
Login Page API
IONIC
Import the OtplessManager
import {OtplessManager} from 'otpless-ionic';
In your login component create the instance of OtplessManager.
let manager = new OtplessManager()
Call showOtplessLoginPage method on button click or while loading component to launch OTPless sdk
let jsonParams = {appId: "APP_ID"}
const data = await manager.showOtplessLoginPage(jsonParams);
IOS
- Go to your application root folder and install pod. Run the below command
pod install
- Add below lines in info.plist file
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<stringotpless.your_app_id_in_lowercase</string>
</array>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLName</key>
<string>otpless</string>
</dict>
</array>
<key>LSApplicationQueriesSchemes</key>
<array>
<string>whatsapp</string>
<string>otpless</string>
<string>gootpless</string>
<string>com.otpless.ios.app.otpless</string>
<string>googlegmail</string>
</array>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
<key>NSExceptionDomains</key>
<dict>
<key>80.in.safr.sekuramobile.com</key>
<dict>
<key>NSIncludesSubdomains</key>
<true/>
<key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
<true/>
<key>NSTemporaryExceptionMinimumTLSVersion</key>
<string>TLSv1.1</string>
</dict>
<key>partnerapi.jio.com</key>
<dict>
<key>NSIncludesSubdomains</key>
<true/>
<key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
<true/>
<key>NSTemporaryExceptionMinimumTLSVersion</key>
<string>TLSv1.1</string>
</dict>
</dict>
</dict>
- Add application method in your AppDelegate
import OtplessSDK
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
if (Otpless.sharedInstance.isOtplessDeeplink(url: url)) {
Otpless.sharedInstance.processOtplessDeeplink(url: url)
return true
}
return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
}
}
Android
- In MainActivity register the plugin, before calling
super.onCreate
.
import com.otpless.ionic.OtplessPlugin;
protected void onCreate(Bundle savedInstanceState) {
registerPlugin(OtplessPlugin.class);
super.onCreate(savedInstanceState);
}
@Override
public void onBackPressed() {
if (OtplessPlugin.onBackPressed(this)) return;
super.onBackPressed();
}
- In AndroidManifest file added the intent filter in activity tag of your MainActivity
<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:host="otpless"
android:scheme= "otpless.your_app_id_in_lowercase"/>
</intent-filter>
Headless API
IONIC
- Import the OtplessManager
import {OtplessManager} from 'otpless-ionic';
- In your login component create the instance of OtplessManager.
let manager = new OtplessManager()
- Init the headless sdk in useEffect webhook
useEffect(() => {
manager.initHeadless("APP_ID");
manager.setHeadlessCallback(onHeadlessResult);
return () => {
manager.clearListener();
}
}, []);
const onHeadlessResult = (data: any) => {
let message: string = JSON.stringify(data);
console.log(message);
}
create phone number request for headless initialization
headlessRequest = {
"phone": phoneNumber,
"countryCode": "91"
}
- for verification otp field is required
headlessRequest = {
"phone": phoneNumber,
"countryCode": "91",
"otp": otp
}
create email request for headless initialization
headlessRequest = {
"email": email
}
- for verification otp field is required
headlessRequest = {
"email": email,
"otp": otp
}
create sso request like whatsapp for headless initialization
headlessRequest = {
"channelType": WHATSAPP
}
- for verification otp field is required, in case of magic link no verification call is required, it is handled by sdk when user click on link.
headlessRequest = {
"channelType": WHATSAPP,
"otp": otp
}
call startHeadless result is given in onHeadlessResult method
await manager.startHeadless(headlessRequest);
IOS
- Go to your application root folder and install pod. Run the below command
pod install
- Add below lines in info.plist file
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<stringotpless.your_app_id_in_lowercase</string>
</array>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLName</key>
<string>otpless</string>
</dict>
</array>
<key>LSApplicationQueriesSchemes</key>
<array>
<string>whatsapp</string>
<string>otpless</string>
<string>gootpless</string>
<string>com.otpless.ios.app.otpless</string>
<string>googlegmail</string>
</array>
<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
<key>NSExceptionDomains</key>
<dict>
<key>80.in.safr.sekuramobile.com</key>
<dict>
<key>NSIncludesSubdomains</key>
<true/>
<key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
<true/>
<key>NSTemporaryExceptionMinimumTLSVersion</key>
<string>TLSv1.1</string>
</dict>
<key>partnerapi.jio.com</key>
<dict>
<key>NSIncludesSubdomains</key>
<true/>
<key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
<true/>
<key>NSTemporaryExceptionMinimumTLSVersion</key>
<string>TLSv1.1</string>
</dict>
</dict>
</dict>
- Add application method in your AppDelegate
import OtplessSDK
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
if (Otpless.sharedInstance.isOtplessDeeplink(url: url)) {
Otpless.sharedInstance.processOtplessDeeplink(url: url)
return true
}
return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
}
}
Android
- In MainActivity register the plugin, before calling
super.onCreate
.
import com.otpless.ionic.OtplessPlugin;
protected void onCreate(Bundle savedInstanceState) {
registerPlugin(OtplessPlugin.class);
super.onCreate(savedInstanceState);
}
@Override
public void onBackPressed() {
if (OtplessPlugin.onBackPressed(this)) return;
super.onBackPressed();
}
- In AndroidManifest file added the intent filter in activity tag of your MainActivity
<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:host="otpless"
android:scheme= "otpless.your_app_id_in_lowercase"/>
</intent-filter>