yarn react-native-auth0 1.0.0

latest releases: 3.2.0, 3.1.0, 3.0.2...
6 years ago

Full Changelog

Installation

Install react-native-auth0 using npm

npm install react-native-auth0 --save

Or via yarn

yarn add --dev react-native-auth0

then you need to link the native module in react-native-auth0

react-native link react-native-auth0

Configuration

This section is for those that want to use WebAuth, if you dont need it just ignore this section.

Android

In the file android/src/app/AndroidManifest.xml you must make sure the main activity of the app has launch mode value of singleTask and that it has the following intent filter

<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="YOUR_AUTH0_DOMAIN"
        android:pathPrefix="/android/${applicationId}/callback"
        android:scheme="${applicationId}" />
</intent-filter>

So if you have samples.auth0.com as your Auth0 domain you would have the following activity configuration:

<activity
android:name=".MainActivity"
android:label="@string/app_name"
android:launchMode="singleTask"
android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
android:windowSoftInputMode="adjustResize">
<intent-filter>
    <action android:name="android.intent.action.MAIN" />
    <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
<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="samples.auth0.com"
        android:pathPrefix="/android/${applicationId}/callback"
        android:scheme="${applicationId}" />
</intent-filter>
</activity>

For more info please read react native docs

iOS

Inside the ios folder find the file AppDelegate.[swift|m] add the following to it

#import <React/RCTLinkingManager.h>

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url
  sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
  return [RCTLinkingManager application:application openURL:url
                      sourceApplication:sourceApplication annotation:annotation];
}

Then in your Info.plist file, find the value of the entry of CFBundleIdentifier, e.g.

<key>CFBundleIdentifier</key>
<string>org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)</string>

and then register a URL type entry using the value of CFBundleIdentifier as the value of CFBundleURLSchemes

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleTypeRole</key>
        <string>None</string>
        <key>CFBundleURLName</key>
        <string>auth0</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)</string>
        </array>
    </dict>
</array>

The value org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier) is the default for apps created with RN cli, you will probably have a different value.

For more info please read react native docs

Usage

import Auth0 from 'react-native-auth0';

const auth0 = new Auth0({ domain: '{YOUR_AUTH0_DOMAIN}', clientId: '{YOUR_CLIENT_ID}' });

WebAuth

auth0
    .webAuth
    .authorize({scope: 'openid email'})
    .then(credentials => console.log(credentials))
    .catch(error => console.log(error));

Don't miss a new react-native-auth0 release

NewReleases is sending notifications on new releases.