I am working on an Angular project that is a small application that will only be accessible by users who have already authenticated using Okta into a separate web application. The goal is to have users sign into the main website (not angular, vanilla.js) using Okta (which is already set up and functioning correctly on the main website), and then show a button or link the user can click that will navigate to the Angular app.
We do NOT want the user to have to input credentials again after clicking the button to access the Angular app, but rather somehow “pass” the session/token to the Angular app, which upon navigating to in the browser, the Angular app checks for this “session/credentials/token” from the initial log-in to the main website. If the session/credentials/token is good, the Angular app loads in a new tab for the user. If not, the user is redirected back to the main login page (self hosted Okta widget).
We do not want users to be able to copy/paste this URL into a browser and access the Angular app without first authenticating using the self-hosted Okta widget on the main website.
The Angular app and the main website are not in the same folder, project, or solution, and are using different frameworks/stacks. The Angular app completes CRUD functionality using it’s own standalone ASP.Net 5 Web API project - these are not within the same project/solution as the main website.
What is the best way to do this? I am thinking we could use Javascript to send the http request Authorization header containing the Okta information to the home page of the Angular app…but I’m not finding any documentation that goes over this or how to do it.
Another teammate is thinking we can store a token in the session storage of the browser, and have the Angular app check for this token before loading anything, is this an option?