I am facing an issue with authenticating my SPFx webpart against an Azure AD backed Web API. What I have done so far is

  • Created a ASP.NET WEB API 2 project. Added OWIN and configured CORS and OIDC in the pipeline.
  • This works perfectly well when I try to authenticate via the browser by calling the endpoint.
  • But when I try to do this via SPFx I get a CORS error that says “Origin null is not allowed”. This is same one a couple of others got here

Some Observations:

  • When I deploy my application to an Azure app service and turn on the Authentication from the app service, magically things start to work fine. I am unable to figure out what is it that I am missing in my OIDC configuration that is causing this.
  • Also, a bit of network trace showed the following
    1. Options request is sent to Web server
    2. Web server responds with 200 OK
    3. This leads to a redirect 302 to location login.microsoftonline.com with my client ID of the application and other parameters in the querystring.
    4. This redirect throws a CORS error because the Origin header is null in this case.

Below is how OWIN is setup.


 public partial class Startup
        public void Configuration(IAppBuilder app)
            var corsPolicy = new CorsPolicy()
                AllowAnyHeader = true,
                AllowAnyMethod = true,
                SupportsCredentials = true

            CorsOptions corsOptions = new CorsOptions()
                PolicyProvider = new CorsPolicyProvider()
                    PolicyResolver = context => Task.FromResult(corsPolicy)
            ConfigureAuth(app); //Calls within Startup.Auth.cs



public partial class Startup
        public void ConfigureAuth(IAppBuilder app)
            app.UseCookieAuthentication(new CookieAuthenticationOptions());
                 new OpenIdConnectAuthenticationOptions
                     ClientId = "8755bda6-a388-42fc-a8e1-8f2652603334",
                     Authority = "https://login.microsoftonline.com/m365x081712.onmicrosoft.com/",
                     Notifications = new OpenIdConnectAuthenticationNotifications()
                         RedirectToIdentityProvider = (context) =>
                             string appBaseUrl = context.Request.Scheme + "://" + context.Request.Host + context.Request.PathBase;
                             context.ProtocolMessage.RedirectUri = appBaseUrl + "/";
                             context.ProtocolMessage.PostLogoutRedirectUri = appBaseUrl;
                             return Task.FromResult(0);


The SPFx (react) code that calls the Web API is

import { AadHttpClient, HttpClientResponse } from '@microsoft/sp-http';
// .. Omitted bunch of unneeded code.

      .then((client: AadHttpClient): void => {
          .get("https://localhost:44386/api/values", AadHttpClient.configurations.v1,{
            credentials:"include", //probably don't need this.
          .then((response: HttpClientResponse): Promise<any[]> => {
            return response.json();
          .then((data: any[]): void => {
  • Please use this my article – Sergei Sergeev Jan 29 '19 at 10:09
  • @SergeiSergeev The article you shared is for core. I am currently working on ASP.NET Web API 2. – Tanmay Jan 30 '19 at 5:16
  • The code for WEB API 2 with OWIN looks very similar, I'm pretty sure you can get the idea from the post – Sergei Sergeev Jan 30 '19 at 5:19
  • @SergeiSergeev I haven't been able to get it to work. Curious to know if you've succeeded with it. I see a few github issues too (linked above) about people complaining the same thing as I am facing. One key difference i see is you are using JwtBearerAuth and I am using OpenIDConnect. Could that be the cause? – Tanmay Jan 30 '19 at 5:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.