web api request to /token works but request to other api controllers throws 404 (cors related)

Question

I am a little puzzled with issue here.

I have enabled CORS by adding the following code in startup

var enableCorsAttribute = new EnableCorsAttribute("*",
                                           "Origin, Content-Type, Accept",
                                           "GET, PUT, POST, DELETE, OPTIONS");
        config.EnableCors(enableCorsAttribute);

And request to /token is working correctly. I get the correct token, and I have tested using postman.

When I try to request to other API controllers it fires 404 error saying

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

I understand that's the header is missing but I am not sure how to configure this other than the code I have posted above.

I am running angular 2 app to perform the request.

Any help would be much appreciated!

Answer 1

I finally got it working after spending about 2 days... hopefully this answer helps other who might have the same problem.

One thing to note - if you implement or extend simple auth code,

inside this method GrantResourceOwnerCredentials you will have the following line of the code.

context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { allowedOrigin });

This is causing the inconsistency between /token request headers and request to other API controllers.

Long story short, comment this line so same request header is applied.

I have made changes to the web.config as the following

 <handlers>
  <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
  <remove name="OPTIONSVerbHandler" />
  <remove name="TRACEVerbHandler" />      
  <add name="ExtensionlessUrlHandler-Integrated-4.0"  path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />      
  <remove name="WebDav" />
  <add name="OPTIONSVerbHandler" path="*" verb="OPTIONS" modules="IsapiModule" scriptProcessor="C:\Windows\System32\inetsrv\asp.dll" resourceType="Unspecified" requireAccess="None" />      
  <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
  <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
  <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
  <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />      
</handlers>
<httpProtocol>
  <customHeaders>

    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Headers" value="*" />
    <add name="Access-Control-Allow-Methods" value="*" />
  </customHeaders>
</httpProtocol>

And just in case you still have problems with options request, you can go to global.asax.cs file and modify the response as the following:

if ((HttpContext.Current.Request.HttpMethod == "OPTIONS"))
            { 

            HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept, Authorization");
            HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
            HttpContext.Current.Response.End();
            }

I really hope this answer saves someone else's time!