Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/oktadev/okta-ionic-auth-example
Example showing Ionic Authentication with Okta
https://github.com/oktadev/okta-ionic-auth-example
angular authentication ionic oidc okta
Last synced: 3 months ago
JSON representation
Example showing Ionic Authentication with Okta
- Host: GitHub
- URL: https://github.com/oktadev/okta-ionic-auth-example
- Owner: oktadev
- License: apache-2.0
- Created: 2017-06-07T17:04:02.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-02-27T18:29:20.000Z (almost 2 years ago)
- Last Synced: 2024-04-15T15:55:12.811Z (10 months ago)
- Topics: angular, authentication, ionic, oidc, okta
- Language: TypeScript
- Homepage: https://developer.okta.com/blog/2017/08/22/build-an-ionic-app-with-user-authentication
- Size: 3.33 MB
- Stars: 23
- Watchers: 6
- Forks: 15
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Ionic App with Okta Authentication
## This is an old example. Please see [Ionic + Sign in with Apple and Google](https://developer.okta.com/blog/2020/09/21/ionic-apple-google-signin) for an updated version.
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](https://developer.okta.com/blog/2017/08/22/build-an-ionic-app-with-user-authentication) to see how this application was created.
**Prerequisites:** [Node.js](https://nodejs.org/).
> [Okta](https://developer.okta.com/) 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](#getting-started)
* [Links](#links)
* [Help](#help)
* [License](#license)
## Getting Started
To install this example application, run the following commands:
```bash
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](https://www.okta.com/developer/signup/) 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.
```typescript
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:
## Links
This example uses the following libraries provided by Okta:
* [Okta Auth SDK](https://github.com/okta/okta-auth-js)
It also uses the following library provided by [Manfred Steyer](https://github.com/manfredsteyer):
* [angular-oauth2-oidc](https://github.com/manfredsteyer/angular-oauth2-oidc)
## Help
Please post any questions as comments on the [blog post](https://developer.okta.com/blog/2017/08/22/build-an-ionic-app-with-user-authentication), or visit our [Okta Developer Forums](https://devforum.okta.com/). You can also email [email protected] if would like to create a support ticket.
## License
Apache 2.0, see [LICENSE](LICENSE).