CODEWITHSUNDEEP
asp.net-web-api2openid-connectoktaowin-middleware
Shawn
Shawn

Reputation: 889

Okta OpenID Connect - OWIN Static File Middleware SPA

I have an Angular (2.x) Spa application that utilizes webapi calls from the backend. The assets for the Spa are hosted via Owin static file middleware not an MVC controller returning a view. I am trying to integrate with Okta for SSO utilizing OpenID Connect oauth2 code flow. Thus I would have expected a simple example like the following to work:

https://github.com/oktadeveloper/okta-oidc-spa-osw-aspne

However, the example uses a controller action to host the view. Bottom line I have an Authorize attribute on my webapi endpoint that returns 302 requests to the okta /oauth2/v1/authorize endpoint which ultimately is giving me an error like the following:

XMLHttpRequest cannot load https://xxxxx.okta.com/oauth2/v1/authorize?client_id=xxxxx&re…xxxxx. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:54544' is therefore not allowed access.

I enabled CORS on my webapi config that did not result in any change as well.

Configuration is as follows:

app.SetDefaultSignInAsAuthenticationType(CookieAuthenticationDefaults.AuthenticationType);
            app.UseCookieAuthentication(new CookieAuthenticationOptions { });
            app.UseOpenIdConnectAuthentication(new OpenIdConnectAuthenticationOptions
            {
                ClientId = "xxxxxx",
                Authority = "https://xxxxx.okta.com",
                ClientSecret = "xxxxxxx"
            });

So a couple questions result, should I even be using the OpenIdConnectAuthentication middleware, how do I get the re-directs to work on a static asset that I have no controller action to tag an authorize attribute to. Etc. Another thing that the example project has looks like a pop-up widget for okta sign on which seems like it is un-necessary if you just re-direct to them when an unauthorized user is detected.

Upvotes: 0

Views: 542

Answers (1)

Nate Barbettini
Nate Barbettini

Reputation: 53690

OpenID Connect does work for a SPA, although it may make more sense in your scenario to use the implicit flow instead of the code flow. See this general answer: Authentication for SPA

Choosing implicit vs. code depends on what you ultimately want your SPA to have access to. Do you want the SPA to directly hold onto an access token (implicit), or do you want that to stay on the server (code)? There isn't a simple answer because it depends a lot on how your app is built and what you need it to do.

Another, possibly simpler option is to use the Okta Sign-in Widget in your SPA, which can handle a lot of this for you. There's a tutorial on setting this up in an Angular app.

Full disclosure: I work at Okta.

Upvotes: 2

Related Questions