Angular.js-CORS-ASP.NET-Rest API-在Access-Control-Allow-Origin标头中找不到原始

Question

Currently working on a web page that does a call to a rest api which hits my SQL server. Works on local host in VS2013 however when published and added to the server I began to run into issues with CORS. I have added the following code to my web.config file for my web service and still no luck:

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

My webapiconfig.cs looks like this with Cors enabled:

 public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.EnableCors();
        var json = config.Formatters.JsonFormatter;
        json.SerializerSettings.PreserveReferencesHandling = Newtonsoft.Json.PreserveReferencesHandling.Objects;
        json.SerializerSettings.ContractResolver = new
            CamelCasePropertyNamesContractResolver();
        config.Formatters.Remove(config.Formatters.XmlFormatter);

        // Web API configuration and services
        // Configure Web API to use only bearer token authentication.
        config.SuppressDefaultHostAuthentication();
        config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));

        // Web API routes
        config.MapHttpAttributeRoutes();

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

And my controller file that does the call has the proper CORS header as well:

{
    [EnableCors(origins: "*", headers: "*", methods: "*")]
public class RefurbItemsController : ApiController
{

    // GET: api/RefurbItems
    [Route("api/RefurbItems")]
    public HttpResponseMessage Get()
    {
        var items = RefurbItems.GetAllItems();
        HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.OK, items);
        return response;
    }

    // GET: api/RefurbItems/5
    public string Get(int id)
    {
        return "value";
    }

    // POST: api/RefurbItems
    public void Post([FromBody]string value)
    {
    }

    // PUT: api/RefurbItems/5
    public void Put(int id, [FromBody]string value)
    {
    }

    // DELETE: api/RefurbItems/5
    public void Delete(int id)
    {
    }
}

It runs fine locally on both my dev machine and the server itself, however when I attempt to deploy it to the web and view the page I get the following error message: Origin not found in Access-Control-Allow-Origin header. XMLHttpRequest: Network Error 0x80070005, Access is denied.

If anyone can help out with some ideas or anything I am open to try I am new to asp.net

Answer 1

Turned out the issue was that I had EnableCors located in 2 locations it was in both the class and the controller:

WebApiConfig.cs

    config.EnableCors();
    var json = config.Formatters.JsonFormatter;
    json.SerializerSettings.PreserveReferencesHandling = Newtonsoft.Json.PreserveReferencesHandling.Objects;
    json.SerializerSettings.ContractResolver = new
        CamelCasePropertyNamesContractResolver();
    config.Formatters.Remove(config.Formatters.XmlFormatter);

Controller

[EnableCors(origins: "*", headers: "*", methods: "*")]  

All i had to do was delete the config.EnableCors() located in the WebApiConfig.cs and everything started working correctly.