0

I have the following headers in my WebAPI web.config: 


  <httpProtocol>
    <customHeaders>
      <add name="Access-Control-Allow-Origin" value="https://localhost:44379" />
      <add name="Access-Control-Allow-Methods" value="*" />
      <add name="Access-Control-Allow-Headers" value="X-Requested-With, content-type, Accept, Origin, Authorization, User-Agent, Referer" />
      <add name="Access-Control-Allow-Credentials" value="true" />
    </customHeaders>
  </httpProtocol>

When I send the following POST call in front-end, I get the errors:

"Access to fetch at 'https://server-name/Grouping/api/Grouping/GetGroupByProcessId' from origin 'https://localhost:44379' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status."

and

OPTIONS https://server-name/Grouping/api/Grouping/GetGroupByProcessId 401 (Unauthorized)


var headers = new Headers();

            headers.append("Content-Type", "application/json");
            headers.append("Accept", "application/json");

            fetch("https://<host-name>/Grouping/api/Grouping/GetGroupByProcessId", {
                method: "POST",
                 credentials: "include",
                headers: headers,
                body: JSON.stringify({ GroupingValue: groupingValue }) //groupingValue is just a JSON array
            })
                .then(res => res.json())
                .then(data => console.log(data))

Examining the response and request headers in the console, I see the following, and everything looks fine to me.

This is what the request looks li.e

I can't seem to figure out why I keep getting an unauthorized message.
My GET requests are going through just fine.

This answer suggests that you can send JSON with a post, but I have that header for Allow-Headers and it's still not working. Any help would be appreciated!

jf1234
  • 215
  • 1
  • 11
  • See https://blogs.msmvps.com/kenlin/2018/01/18/2694/ – Shahid Syed Sep 17 '19 at 03:44
  • In your `WebApiConfig.cs` file, under the `Register` method, add the following: `EnableCorsAttribute cors = new EnableCorsAttribute("http://localhost:44379", "*", "GET,POST"); config.EnableCors(cors);` – Rahul Sharma Sep 17 '19 at 06:16

1 Answers1

0

Open the file App_Start/WebApiConfig.cs. Add the following code to the WebApiConfig.Register method:

public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // New code
            config.EnableCors();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }

Next, add the [EnableCors] attribute to the TestController class:

using System.Net.Http;
using System.Web.Http;
using System.Web.Http.Cors;

namespace WebService.Controllers
{
    [EnableCors(origins: "http://host-name.com", headers: "*", methods: "*")]
    public class TestController : ApiController
    {
        // Controller methods not shown...
    }
}
awais
  • 492
  • 4
  • 17