Repository containing the source of Asgardeo React Native OIDC SDK & Samples.
🚧 This project is a work in progress. Please do not use this yet!
Asgardeo's OIDC SDK for React Native allows Mobile Applications to use OIDC or OAuth2 authentication in a simple and secure way. By using Asgardeo and the React Native OIDC SDK, Mobile application developers will be able to add identity management to their Mobile Applications with more ease.
Install the library from the npm registry.
npm install --save @asgardeo/auth-react-native
You can experience the capabilities of Asgardeo React-native OIDC SDK by following this small guide which contains main sections listed below.
-
Start the WSO2 IS.
-
Access WSO2 IS management console from https://localhost:9443/carbon/ and create a service provider. i. Navigate to the
Service Providers
tab listed under theIdentity
section in the management console and clickAdd
.
ii. Provide a name for the Service Provider (ex:- sampleRN-app) and clickRegister
. Now you will be redirected to theEdit Service Provider
page.
iii. Expand theInbound Authentication Configuration
section and clickConfigure
under theOAuth/OpenID Connect Configuration
section.
iv. Under AllowedGrant Types
uncheck everything exceptCode
andRefresh Token
. v. Enter Callback URL(s) like as the following values.Callback Url - http://{hostname}:{port}
Callback Url - http://10.0.2.2:8081
vi. Check Allow authentication without the client secret
.
vii. Click Update
to save.
- Once the service provider is saved, you will be redirected to the
Service Provider Details
page. Here, expand theInbound Authentication Configuration
section and click theOAuth/OpenID Connect Configuration
section. Copy the value ofOAuth Client Key
shown here.
-
Clone/download this project from
https://github.com/asgardeo/asgardeo-react-native-oidc-sdk.git
. -
Open the cloned project directory via code editors.
-
Add the relevant configs in LoginScreen file located in
Screen/LoginScreen
folder.- Replace the value of
client-id
with the value ofOAuth Client Key
property which you copied in the step 3 when configuring the Identity Server.
const Config = { serverOrigin: 'https://{hostname}:9443', signInRedirectURL: 'http://{hostname}:{port}', clientID: 'ClientID', SignOutURL: "http://{hostname}:{port}" (Optional) };
Example:
const Config = { serverOrigin: 'https://10.0.2.2:9443', signInRedirectURL: 'http://10.0.2.2:8081', clientID: 'iMc7TiIaIFafkd5hA5xf7kGiAWUa', SignOutURL: "http://10.0.2.2:8081" (Optional) };
- Replace the value of
-
Create a suitable Android Virtual Device by run
react-native run-android
command in project directory terminal. -
If the WSO2 IS is hosted in the local machine, change the domain of the endpoints in the
Screen/LoginScreen - Config
file to “10.0.2.2”. Refer the documentation on emulator-networking -
By default IS uses a self-signed certificate. If you are using the default pack without changing to a CA signed certificate, follow this guide to get rid of SSL issues.
-
Change the hostname of IS as 10.0.2.2 in the <IS_HOME>/deployment.toml.
i. Create a new keystore with CN as localhost and SAN as 10.0.2.2keytool -genkey -alias wso2carbon -keyalg RSA -keystore wso2carbon.jks -keysize 2048 -ext SAN=IP:10.0.2.2
ii. Export the public certificate ( name it as wso2carbon.pem ) to add into the truststore.
keytool -exportcert -alias wso2carbon -keystore wso2carbon.jks -rfc -file wso2carbon.pem
iii. Import the certificate in the client-truststore.jks file located in
<IS_HOME>/repository/resources/security/
keytool -import -alias wso2is -file wso2carbon.pem -keystore client-truststore.jks -storepass wso2carbon
iv. Now copy this public certificate ( wso2carbon.pem ) into the
app/src/main/res/raw
folder. -
Select the Virtual Device to run the application.
-
Run the the module
sample
on the selected Virtual Device.
-
Enable USB Debugging in the Developer Options in the Android Device. Refer documentation on Run your App.
-
If the WSO2 IS is hosted in the local machine, change the domain of the endpoints in the
Screen/LoginScreen - Config
file and the hostnames specified underhostname
config in the<IS_HOME>/repository/conf/deployment.toml
file to the IP Address of local machine. Make sure that both the Android Device and the local machine is connected to the same WIFI network. -
By default IS uses a self-signed certificate. If you are using the default pack without changing to a CA signed certificate, follow this guide to get rid of SSL issues.
-
Change the hostname of IS as IP Address in the <IS_HOME>/deployment.toml.
i. Create a new keystore with CN as localhost and SAN as IP Addresskeytool -genkey -alias wso2carbon -keyalg RSA -keystore wso2carbon.jks -keysize 2048 -ext SAN=IP:IP Address
ii. Export the public certificate ( name it as wso2carbon.pem ) to add into the truststore.
keytool -exportcert -alias wso2carbon -keystore wso2carbon.jks -rfc -file wso2carbon.pem
iii. Import the certificate in the client-truststore.jks file located in
<IS_HOME>/repository/resources/security/
keytool -import -alias wso2is -file wso2carbon.pem -keystore client-truststore.jks -storepass wso2carbon
iv. Now copy this public certificate ( wso2carbon.pem ) into the
app/src/main/res/raw
folder. -
Connect the Android Device to the machine through a USB cable.
-
Select the Android Device as the Deployment Target.
-
Run the the module
sample
on the selected Android Device.
The SDK provides some APIs necessary methods to implement an authentication.
- initialize
- getDataLayer
- getAuthorizationURL
- requestAccessTokenDetails
- getSignOutUrl
- SignOut
- getOIDCServiceEndpoints
- getDecodedIDToken
- userInformation
- revokeAccessToken
- refreshAccessToken
- getAccessToken
- isAuthenticated
- getPKCECode
- setPKCECode
initialize = async (config):Promise<void> ;
- config: This config contains the ClientID, server Origin, SigINRedirectURL, SighOutRedirectUrl,and etc. This information needed to umplement the authentication.
This method initializes the config data instance.
const Config = {
serverOrigin: 'https://10.0.2.2:9443',
signInRedirectURL: 'http://10.0.2.2:8081',
clientID: 'iMc7TiIaIFafkd5hA5xf7kGiAWUa',
SignOutURL: "http://10.0.2.2:8081" (Optional)
};
await initialize(Config)
getDataLayer = async ()
This method returns DataLayer objects used by the SDK to store authentication data.
const _dataLayer = await getDataLayer();
getAuthorizationURL = async (config): Promise<String>
- config: This config contains the ClientID, server Origin, SigINRedirectURL, SighOutRedirectUrl,and etc. This information needed to umplement the authentication.
This method returns a Promise resolve with the authorization URL. Then the user can redirect to this URL to authenticate themselves and athorize the client.
getAuthorizationURL(Config).then((url) => {
Linking.openURL(url)
}).catch((error) => {
console.error(error);
});
requestAccessTokenDetails = (AuthUrl)
- AuthUrl This is a url. After the user signs in with using Identity server can get this url. It contains sessionState and authorizationCode these are obtained from identity server.
This method uses the authorization code and session state to send a request to the token endpoint to obtain the acess token and the id token. The sign-in functionality can be implemented by calling the getAuthorizationURL method followed by this method.
requestAccessTokenDetails(AuthUrl).then((token) => {
console.log(token)
}).catch((error) => {
console.log(error)
});
getSignOutURL = async ()
This method returns the sign-out URL to which the user should be redirected to be signed out from the server. The user should be redirect to this URL in order to sign out from the server.
const signOutUrl = await getSignOutURL()
Linking.openURL(signOutUrl)
SignOut = (Url)
- Url This url contains state details obtainted from Identity server after the user redirect SigOutURL with Identityserver.
This method return boolean value. This method clear the authentication data from the store and sign out from the Identity server when state is sign_out_sucess and returns true. Otherwise It returns false without any changes in store or Identity server.
_signOut = SignOut(Url)
getOIDCServiceEndpoints = async()
This method returns the OIDC service endpoints obtained from the .well-known
endpoint.
// This should be within an async function.
const endpoints = await getOIDCServiceEndpoints();
getDecodedIDToken = async ()
This method decodes the payload of the id token and returns the decoded values.
// This should be within an async function.
const decodedIdToken = await getDecodedIDToken();
userInformation = async ()
This method returns the basic user information obtained from the id token.
// This should be within an async function.
const UserInfo = await userInformation();
revokeAccessToken = async ()
This method clears the authentication data and sends a request to revoke the access token. You can use this method if you want to sign the user out of your application but not from the server.
revokeAccessToken().then((response) => {
console.log(response);
}).catch((error) => {
console.error(error);
})
refreshAccessToken = async (): Promise<TokenResponse>
This method sends a refresh-token request and returns a promise that resolves with the token response that contains the token information.
refreshAccessToken().then((response) => {
console.log(response);
}).catch((error) => {
console.error(error);
})
getAccessToken = async ()
This method returns the access token stored in the store.
// This should be used within an async function.
const accessToken = await getAccessToken();
isAuthenticated = async ()
This method returns a boolean value indicating if the user is authenticated or not.
// This should be within an async function.
const isAuth = await isAuthenticated();
getPKCECode = async ()
This code returns the PKCE code generated when the authorization URL is generated by the getAuthorizationURL
method.
const pkce = getPKCECode();
setPKCECode = async (pkce:string)
- pkce:
string
The PKCE code generated by the getAuthorizationURL
method.
This method sets the PKCE code to the store.
setPKCECode("pkce");
Please read Contributing to the Code Base for details on our code of conduct, and the process for submitting pull requests to us.
We encourage you to report issues, improvements, and feature requests creating Github Issues.
Important: And please be advised that security issues must be reported to security@wso2com, not as GitHub issues, in order to reach the proper audience. We strongly advise following the WSO2 Security Vulnerability Reporting Guidelines when reporting the security issues.
This project is licensed under the Apache License 2.0. See the LICENSE file for details.