react-native-msal
Live Demo (Web)
https://stashenergy.github.io/react-native-msal/
Table of Contents
Install
Requires React Native >=0.61
Stable version:
$ yarn add react-native-msal
Beta version:
$ yarn add react-native-msal@beta
Don't forget to run npx pod-install
after!
Setup
Expo
Follow the Expo setup guide
Non-expo
Follow the Android setup guide and the iOS setup guide
Use
import PublicClientApplication from 'react-native-msal';
import type { MSALConfiguration } from 'react-native-msal';
const config: MSALConfiguration = {
auth: {
clientId: 'your-client-id',
authority: 'https://<authority url>',
},
};
const scopes = ['scope1', 'scope2'];
const pca = new PublicClientApplication(config);
try {
await pca.init();
} catch (error) {
console.error('Error initializing the pca, check your config.', error);
}
const params: MSALInteractiveParams = { scopes };
const result: MSALResult | undefined = await pca.acquireToken(params);
const params: MSALSilentParams = {
account: result!.account,
scopes,
forceRefresh: true,
};
const result: MSALResult | undefined = await pca.acquireTokenSilent(params);
const accounts: MSALAccount[] = await pca.getAccounts();
const account: MSALAccount | undefined = await pca.getAccount(result!.account.identifier);
const success: boolean = await pca.removeAccount(result!.account);
const params: MSALSignoutParams = {
account: result!.account,
signoutFromBrowser: true,
};
const success: boolean = await pca.signOut(params);
B2C Applications
The PublicClientApplication
class is a bit too bare bones for dealing with a B2C application, and you will need to write a bit of code to get the desired behavior.
To address this issue, the example app that is included in this repository includes a B2CClient
class which contains a lot of the functionality you will need for a B2C app. You can copy this class right into your own React Native app and modify it to your liking. You can see it being used in the example's App.tsx
If you would like to see this class included in the library itself, please let us know.
Example App
As mentioned above, the example app demonstrates a B2C implementation
To run the example locally, first clone the repo and run $ yarn
to bootstrap the project. Then run the following for the desired platform:
iOS: $ yarn example ios
Android: $ yarn example android
Web: $ yarn example web
(the example app is also running live here)
If you want to run the example using your own Azure application information:
- Register the redirect URLs in your tenant:
- Android:
msauth://com.example/Xo8WBi6jzSxKDVR4drqm84yr9iU%3D
- iOS:
msauth.com.example://auth
- Web (SPA):
http://localhost:19006
- Update the
b2cConfig
and b2cScopes
variables in msalConfig.ts
with your details.
Migrating between major versions
See migration instructions in the CHANGELOG.