Configuring CORS in IIS with the IIS CORS Module: A Step-by-Step Guide

[HridayDutta]

Introduction​

The Cross-Origin Resource Sharing (CORS) is a security feature implemented by web browsers that enables control of which resources are accessible based on the origin of requests. This way, web servers are given the authority to define which domains are allowed to access resources, ensuring only trusted sources will interact with your server. In this modern era of applications, where most web apps fetch data from multiple origins, CORS is very important to manage and secure these interactions.



If the CORS is not enabled or configured properly, you often get exception like this - "Access to fetch at 'http://YourApiEndpoint' from origin 'http://YourWebSite' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled."

Solution​

IIS CORS module simplifies the configuration process for the server administrator. The below steps will guide you how to download and install the IIS CORS module and configure it by updating web.config file.



Installation & Configuration

You can download IIS CORS module from the official download link - IIS CORS Module : The Official Microsoft IIS Site.



Download the applicable x86 installer or x64 installer depend on your operating system. Installation is straight forward; you just need to double click the downloaded MSI and installation will guide you through.



Once the IIS CORS module is installed, you can configure it using the web.config file of your application. This allows you to customize the behavior of CORS to suit your application's security and functional requirements. Here is a basic example of how to configure CORS settings in the web.config file -

    <cors enabled="true">
      <add origin="https://example.com" allowCredentials="true" maxAge="600">
        <allowMethods>
          <add method="GET"/>
          <add method="POST"/>
        </allowMethods>
        <allowHeaders>
          <add header="Content-Type"/>
          <add header="Authorization"/>
        </allowHeaders>
        <exposeHeaders>
          <add header="X-Custom-Header"/>
        </exposeHeaders>
      </add>
    </cors>

You need to put this config under system.webServer tag. Below is the breakdown of each tag used in the CORS configurations.

• enabled="true": Enables CORS for the application.
• origin="Example Domain": Specifies the allowed domain.
• allowCredentials="true": Allows cookies to be sent with requests.
• maxAge="600": The number of seconds the browser will cache the CORS response.
• <allowMethods>: Specifies which HTTP methods are allowed (GET, POST, etc.).
• <allowHeaders>: Defines which headers are allowed in the request.
• <exposeHeaders>: Lists headers that the browser can expose to the client.

Conclusion​

Configuring CORS is an essential factor to secure modern web applications that rely on resources from a different origin. The IIS CORS module helps in simplifying the process so that interactions from only trusted domains. The IIS CORS module provides flexibility and control over CORS settings, helping to safeguard your application from potential cross-origin threats while enabling necessary cross-origin functionality.

Continue reading...