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
Links
Help
License

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:

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.

td-edge/okta-ionic-auth-example

Ionic App with Okta Authentication

Getting Started

Links

Help

License