Example showing Ionic Authentication with Okta
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.

README.md

Ionic App with Okta Authentication

This example shows how to create an Ionic application that uses Cordova's in-app browser to log in with Okta.

Please read Build an Ionic App with User Authentication to see how this application was created.

Prerequisites: Node.js.

Okta has Authentication and User Management APIs that reduce development time with instant-on, scalable user infrastructure. Okta's intuitive API and expert support make it easy for developers to authenticate, manage, and secure users and roles in any application.

Getting Started

To install this example application, run the following commands:

git clone https://github.com/oktadeveloper/okta-ionic-auth-example.git
cd okta-ionic-auth-example

This will get a copy of the project installed locally. Then run the following command to install Ionic and Cordova.

npm install -g cordova ionic

Then run the application:

npm install
ionic serve

To integrate Okta's Identity Platform for user authentication, you'll first need to:

  • Register and create an OIDC application
  • Log in to your Okta account and navigate to Applications > Add Application
  • Select SPA and click Next
  • Give your application a name (e.g. "Ionic OIDC")
  • Change the Base URI and Login redirect URI to http://localhost:8100 and click Done.

After performing these steps, copy the clientId into src/pages/login/login.ts and change {yourOktaDomain} to match your account's id.

constructor(private navCtrl: NavController, private oauthService: OAuthService) {
  oauthService.redirectUri = 'http://localhost:8100';
  oauthService.clientId = '{clientId}';
  oauthService.scope = 'openid profile email';
  oauthService.issuer = 'https://{youtOktaDomain}.com/oauth2/default';
  oauthService.tokenValidationHandler = new JwksValidationHandler();
  ...
}

Your OIDC app should have settings like the following:

Okta OIDC Settings

Links

This example uses the following libraries provided by Okta:

It also uses the following library provided by Manfred Steyer:

Help

Please post any questions as comments on the blog post, or visit our Okta Developer Forums. You can also email developers@okta.com if would like to create a support ticket.

License

Apache 2.0, see LICENSE.