(CORS C# ASP.NET Core) Configuring CORS Preflight Policy

In this tutorial, we learn how to set a CORS policy that will respond to a pre-flight OPTIONS request. This policy will specify the list of acceptable request headers, a list of acceptable HTTP methods and a duration value for the Access-Control-Max-Age header.
(Rev. 30-Sep-2022)

Categories | About |     |  

Parveen,

The code in the program.cs file

We have already created a project and attached it as a download to this video. We shall now discuss the code we have configured in the program.cs file. This tutorial is informative so that you know the various possibilities of configuration; you have an idea that such a thing exists. It's handy whenever a need arises.


// program.cs 

var builder = WebApplication.CreateBuilder();

builder.Services.AddRazorPages();

builder.Services.AddCors(options =>
{
  options.AddDefaultPolicy(policy =>
    {
      policy.WithOrigins("https://hoven.in")
            .WithHeaders("X-My-Header", "X-CUSTOM-ANOTHER")
            .WithMethods("PUT", "DELETE", "GET")
            .SetPreflightMaxAge(TimeSpan.FromSeconds(3600));
    }
  );
});

var app = builder.Build();

app.UseCors();

app.MapRazorPages();

app.Run();

Open the solution explorer and locate the program.cs file. Double-click and open it! Let's examine the code line by line.

The first two lines are the usual boilerplate code. After that we have added a default cross-origin policy. Various items of configuration have been illustrated here.

The WithOrigins method adds a list of orgins to the cross-origin policy.

The WithHeaders method adds a list of headers that the application allows. The response to an OPTIONS request adds Access-Control-Allow-Headers header on the basis of this list.

The WithMethods method adds a list of methods that the application allows. The response to an OPTIONS request adds Access-Control-Allow-Methods header on the basis of this list.

The SetPreflightMaxAge method specifies the cache duration of the Access-Control-Max-Age header in response to an OPTIONS request.

Video Explanation (see it happen!)

Please watch the following youtube video:

Test the Application

Let's now test the application by sending an HTTP OPTIONS request from curl.

Run the application and allow the home page to open. Open the command prompt and type the following curl command to send the request.


// must be typed in one single line 

curl -i -X  OPTIONS https://localhost:7276/ 
        -H "origin:https://hoven.in" 
        -H "Access-Control-Request-Method: PUT"
        -H "Access-Control-Request-Headers: X-My-Header"

This command sends an HTTP OPTIONS request to the application with the cross-site origin set to a third party website. It also specifies the request method and a custom header that will be sent in the actual HTTP PUT command.

Hit Enter.

We observe that the server responds with the headers as configured by us. It responds with the correct values for Access-Control-Allow-Headers, Access-Control-Allow-Methods, Access-Control-Allow-Origin and Access-Control-Max-Age.


// respons to OPTIONS request 

HTTP/1.1 204 No Content
Date: Sun, 21 Aug 20--
Server: Kestrel
Access-Control-Allow-Headers: X-My-Header,X-CUSTOM-ANOTHER
Access-Control-Allow-Methods: PUT,DELETE,GET
Access-Control-Allow-Origin: https://hoven.in
Access-Control-Max-Age: 3600

This is how we can configure our application for a pre-flight request. Thanks!


This Blog Post/Article "(CORS C# ASP.NET Core) Configuring CORS Preflight Policy" by Parveen is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.