Wednesday, October 11, 2017

ASP.NET Core 2.0 – Applying CORS Policies

In this post let’s see how we can apply CORS policies for different scenarios (based on the route/path etc.) in an ASP.NET Core 2.0 Web Application.

As you already know, in ASP.NET Core projects, on the Startup.cs, we have 2 methods ConfigureServices and Configure, and these two will get called by the runtime. ConfigureServices is used to add services to the container, so we can use them through out the application. Configure method is used to configure the HTTP Request pipeline.

So moving to the topic, first thing we need to do is AddCors to IoC container, (again so we can consume this through out the application). (Note: these is an alternate way, and I will be describing that later in the post, keep reading forward)
public void ConfigureServices(IServiceCollection services)
{
    // Add policies, so we can consume them when configuring HTTP request pipeline
    services.AddCors(options =>
    {
        string[] origins = new string[] { "http://localhost:2000", "http://localhost:2001" };
 
        options.AddPolicy("MyCorsPolicy", policyBuilder =>
        {
            policyBuilder
                .AllowAnyHeader()
                .AllowAnyMethod()
                .WithOrigins(origins);
        });
    });
 
    services.AddMvc();
}
Once we have defined the CORS policy (you can define many policies), we can configure the HTTP Requests for CORS policies in following ways.
  1. Application Level (Applies to all the HTTP Requests)
  2. Controller Level
  3. Custom

Application Level


This is kind of the basic approach among above three.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
 
    app.UseCors("MyCorsPolicy");
            
    app.UseMvc();
}
Something to note here is, if you prefer not to go with named policies, you can just skip Adding CORS (AddCors) and do as following in Configure method.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
 
    app.UseCors(policyBuilder =>
    {
        string[] origins = new string[] { "http://localhost:2000", "http://localhost:2001" };
 
        policyBuilder
            .AllowAnyHeader()
            .AllowAnyMethod()
            .WithOrigins(origins);
    });
 
    app.UseMvc();
}

Controller Level


If you don’t want to go with Application level and you want to go with Controller level, this is how you can do it.
[EnableCors("MyCorsPolicy")]
[Route("api/[controller]")]
public class ValuesController : Controller
{
    // actions
}
But to do this, so need to have named CORS policies defined.

Note: The precedence order is: Action, controller, global. Action-level policies take precedence over controller-level policies, and controller-level policies take precedence over global policies.

Custom


Imagine, you want to apply CORS policy based on HTTP Request route/path etc. You can use the power of Middleware for that kind of a scenario.

One approach would would be, you can use app.Map and app.MapWhen to branch off the HTTP Request pipeline and use app.UseCors as shown in above, but the downside is your HTTP Request pipeline is getting short-circuited. That of course you can merge back, but personally I don’t find it a good approach.

The other approach (which I personally find best) is, you can easily create a separate Middleware class for handling CORS in following way.
using System;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Cors.Infrastructure;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.Primitives;
 
namespace WebApplication178.Middleware
{
    public class CustomCorsMiddleware
    {
        private readonly RequestDelegate _next;
        private readonly ICorsService _corsService;
        private readonly ICorsPolicyProvider _corsPolicyProvider;
        private readonly CorsPolicy _policy;
        private readonly string _corsPolicyName;
 
        public CustomCorsMiddleware(
            RequestDelegate next,
            ICorsService corsService,
            ICorsPolicyProvider policyProvider)
            : this(next, corsService, policyProvider, policyName: null) { }
 
        public CustomCorsMiddleware(
            RequestDelegate next,
            ICorsService corsService,
            ICorsPolicyProvider policyProvider,
            string policyName)
        {
            _next = next ?? throw new ArgumentNullException(nameof(next));
            _corsService = corsService ?? throw new ArgumentNullException(nameof(corsService));
            _corsPolicyProvider = policyProvider ?? throw new ArgumentNullException(nameof(policyProvider));
            _corsPolicyName = policyName;
        }
 
        public CustomCorsMiddleware(
           RequestDelegate next,
           ICorsService corsService,
           CorsPolicy policy)
        {
            _next = next ?? throw new ArgumentNullException(nameof(next));
            _corsService = corsService ?? throw new ArgumentNullException(nameof(corsService));
            _policy = policy ?? throw new ArgumentNullException(nameof(policy));
        }
 
        public async Task Invoke(HttpContext context)
        {
            if (context.Request.Headers.ContainsKey(CorsConstants.Origin))
            {
                CorsPolicy corsPolicy = null;
 
                // If the following condition matches only apply CORS Policy
                if (context.Request.Path.ToString().ToLower().Contains("something"))
                {
                    corsPolicy = _policy ?? await _corsPolicyProvider?.GetPolicyAsync(context, "MyCustomPolicy");
                }
 
                if (corsPolicy != null)
                {
                    var corsResult = _corsService.EvaluatePolicy(context, corsPolicy);
                    _corsService.ApplyResult(corsResult, context.Response);
 
                    var accessControlRequestMethod = context.Request.Headers[CorsConstants.AccessControlRequestMethod];
                    if (string.Equals(
                            context.Request.Method,
                            CorsConstants.PreflightHttpMethod,
                            StringComparison.OrdinalIgnoreCase) &&
                            !StringValues.IsNullOrEmpty(accessControlRequestMethod))
                    {
                        // Since there is a policy which was identified,
                        // always respond to preflight requests.
                        context.Response.StatusCode = StatusCodes.Status204NoContent;
                        return;
                    }
                }
            }
 
            await _next(context);
        }
    }
}
The whole piece of code is taken from CorsMiddleware.cs (cheers to Microsoft for going open source), and we can just modify it to match our need. Here I have modified it to apply CORS policy based on the request route/path. Now you can simply do following.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
 
    app.UseMiddleware<CustomCorsMiddleware>();
            
    app.UseMvc();
}
The usual behavior of CorsMiddleware would be as follows. For this, you need to have Microsoft.AspNetCore.Cors package installed.
app.UseMiddleware<CorsMiddleware>();
 
// Passing in the policy name
app.UseMiddleware<CorsMiddleware>("MyCorsPolicy");
Hope this helps.

Happy Coding.

Regards,
Jaliya