Auth0 is a social login provider for Nativescript allowing you to choose between 50 different providers. Use the Auth0 portal to select and configure the providers you would like to make available in your NativeScript application. The Auth0 NativeScript plugin will dynamically load your chosen providers into your application.
The dynamically loading feature reduces the amount of dependencies you’ll have in your application. You also don’t have to worry about loading and managing Cocoapods or Android Jars specific to each implementation.
Auth0 is a freemium service. The free tier supports up to 7,000 active users. Auth0 paid service levels are very reasonable.
In addition to managing many login providers, Auth0 also has solutions for application analytics, logging, web tasks and more. Take a look at all of the Auth0 features and services.
tns plugin add nativescript-auth0
Make a new file called Auth0.plist, add this into it, clearly replacing the temp clientids and domain. Note to keep a0 infront of the scheme.
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>None</string>
<key>CFBundleURLName</key>
<string>auth0</string>
<key>CFBundleURLSchemes</key>
<array>
<string>a0myclientid</string>
</array>
</dict>
</array><?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
<key>ClientId</key>
<string>q5atQzi6DgmWBpHWRJbd7MBNa5eLBPRp</string>
<key>Domain</key>
<string>nativescript.auth0.com</string>
</dict>
</plist>Add this to your AndroidManifest.xml
<!--Auth0 Lock-->
<activity
android:name="com.auth0.android.lock.LockActivity"
android:label="Classic Lock"
android:launchMode="singleTask"
android:screenOrientation="portrait"
android:theme="@style/Lock.Theme">
<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="nativescript.auth0.com"
android:pathPrefix="/android/__PACKAGE__/callback"
android:scheme="https" />
</intent-filter>
</activity>
<!--Auth0 Lock End-->
<!--Auth0 Lock Embedded WebView-->
<activity
android:name="com.auth0.android.provider.WebAuthActivity" />
<!--Auth0 Lock Embedded WebView End-->Initalize at the top of your view
import { Auth0Lock } from "nativescript-auth0";Create your lock object, I like to do this in a shared helper or something
var lock = new Auth0Lock({
clientId: '<your clientid>',
domain:'<your domain>',
scopes: [ "offline_access openid"] //Optional param, check the auth0 docs
});Show the lock screen, returns a promise
/// Promise returns
/// {
/// credentials: {
/// accessToken
/// idToken
/// refreshToken
/// },
/// ios: {
/// profile,
/// token
/// },
/// android: {}
/// }
lock.show().then((res) => {
//goToHomeOrWhatevs();
}, function (error) {
//console.log(error);
});| Name | Description | Docs | Returns |
|---|---|---|---|
| refresh() | reloads the saved credentials from app-settings | void | |
| hasValidToken() | Is the token still good, is there a token set, is it expired, couple checks | bool | |
| isTokenExpired() | Decodes the token to check it's expiry | bool | |
| clearToken() | Removes the appsettings key that stores the tokens locally | void | |
| getUserInfo() | Returns the current user details, this is an internal http callback to auth0, might want to cache the results | Link | Promise |
| getTokenInfo() | Token details, this is an internal http callback to auth0, might want to cache the results | Link | Promise |
Total rewrite, hey, but it works! Per semvar incrimenting major version as there's breaking changes. However the bonus of this is you no longer need app.js initaliation code.