0

So this makes it clear that you need a separate CORS preflight request for each resource on the server and since I am working with a RESTFul API that requires custom headers (as well as content-type JSON). However I'd like to avoid making two round trips for (nearly) every request.

My ideal solution would be to preflight multiple resources in one request. So if I want to allow the web app to POST to /user, /media, and /preferences we could do this in one request upfront, even before those requests are first sent out, otherwise horrible latency is added. Is this possible with CORS?

Community
  • 1
  • 1
Jason Axelson
  • 4,485
  • 4
  • 48
  • 56

1 Answers1

0
 public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // 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();
            //var xml = GlobalConfiguration.Configuration.Formatters.XmlFormatter;
           // xml.UseXmlSerializer = true;

            //var json = GlobalConfiguration.Configuration.Formatters.JsonFormatter;
            config.Formatters.JsonFormatter.SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/html"));
            //json.SerializerSettings.PreserveReferencesHandling =
           // Newtonsoft.Json.PreserveReferencesHandling.All;
            //json.SerializerSettings.DateFormatHandling
            //= Newtonsoft.Json.DateFormatHandling.MicrosoftDateFormat;
            config.Formatters.JsonFormatter.SerializerSettings.ContractResolver = new CamelCasePropertyNamesContractResolver();

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

//And on WEBAPI your controller try this.

[EnableCorsAttribute("http://localhost:8080/", "*", "*")]
    public class SampleController : ApiController
    {
        // GET: api/Club

        public IEnumerable<Sample> Get()
        {
            var SampleRepository = new SampleRepository();
            return SampleRepository.Retrieve();
        }

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

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

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

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

//In AngularJS you will get what you want this way using CORS through WEB API

(function () {
    "use strict";
    angular
        .module('sampleManagement')
        .controller('SampleListController',
                     ['sampleResource',
                         SampleListController]);

    function SampleListController(sampleResource) {
        var vm = this;

        sampleResource.query(function (data) {
            vm.Sample = data;

        });
    }

}());



(function () {
    "use strict";

    var app = angular.module('sampleManagement',
        ['common.services']);

}());


(function () {
    "use strict";
    angular.module('common.services',
        ['ngResource'])
    .constant('appSettings',
    {
        serverPath: "http://localhost:8080/"
    });
}());



(function () {
    "use strict";
    angular
        .module('common.services')

        .factory('sampleResource',
        ['$resource',
            "appSettings",
        sampleResource])

    function sampleResource($resource, appSettings) {

        return $resource(appSettings.serverPath + "api/Club/:id");

    }
    app.config(['$resourceProvider', function($resourceProvider) {

        $resourceProvider.defaults.stripTrailingSlashes = false;
    }]);
}());