Okta-auth-js signInWithCredentials with mobile Capacitor App

This might be somewhat of an unusual use case but throwing it out there for any suggestions.

We have an Angular SPA and have been using the okta signin widget for some time but need to replace with a custom sign in page. I’m using the signInWithCredentials API from okta-auth-js and upon success response call token.getWithRedirect to obtain tokens.

This works well in the web application, however, we also bundle our app as a mobile application using the Capacitor framework. If I do nothing the call made to https://dev-xxxxxx.okta.com/oauth2/default/v1/authorize opens in the mobile browser and then redirect to localhost/implicit/callback' fails outside of the apps webview context. localhost` is required by the Capacitor framework for internal routing for the SPA.

There is a setting in the Capacitor configuration to keep the call to dev-xxxxxx.okta.com internal to the webview application however, since that is not an XHR(AJAX) request the app tries to load the page inside of the webview and basically does nothing.

Wondering if there is another approach possible with okta-auth-js? Would like to avoid having to completely manage the flow and write calls directly to the Authentication API if I don’t have to.

The solution that I came up with was calling token.getWithoutPrompt and following that up with a call to tokenManager.setTokens instead of token.getWithRedirect. That is working well for all scenarios and does not rely on a redirect to capture the tokens.

Hey @sdunning thanks for this - we have an Ionic/Angular app that uses Okta Authentication and the app is served on the web as well as devices (we use Capacitor). I ended up using the Ionic App Auth Library for device Authentication and the Angular Okta library for web authentication as I could get neither to work properly in the other scenario. Not great, I’d much rather consolidate somehow! From what you are saying you are using Okta-auth-js and it is working well for you across web and mobile platforms - is that correct?

@richardshergold Yes, the same okta-auth-js implementation is working for both the web and mobile version of our app.Glad to see the info I posted was of some value.

1 Like