Enabling OPTIONS method on Azure Cloud Service (to enable CORS)

Question

I am developing a public API using Azure API Management, which then calls service methods in my cloud service. To allow other apps to use this API from a browser environment, I need to enable CORS in the cloud service. Enabling CORS involves handling OPTIONS requests which are sent by the browser as a pre-flight to check if the correct headers are set.

To make sure the OPTIONS request reaches my application I have had to make a few changes in my web.config:

<system.webServer>
  <handlers>
    <remove name="SimpleHandlerFactory-Integrated-4.0" />
    <remove name="SimpleHandlerFactory-Integrated" />
    <remove name="SimpleHandlerFactory-ISAPI-4.0_64bit" />
    <remove name="SimpleHandlerFactory-ISAPI-4.0_32bit" />
    <remove name="SimpleHandlerFactory-ISAPI-2.0-64" />
    <remove name="SimpleHandlerFactory-ISAPI-2.0" />
    <remove name="OPTIONSVerbHandler" />
    <add name="OPTIONSVerbHandler" path="*" verb="OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" resourceType="Unspecified" requireAccess="None" preCondition="bitness32" />
    <add name="SimpleHandlerFactory-ISAPI-2.0" path="*.ashx" verb="*" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll" resourceType="Unspecified" requireAccess="Script" preCondition="classicMode,runtimeVersionv2.0,bitness32" responseBufferLimit="0" />
    <add name="SimpleHandlerFactory-ISAPI-2.0-64" path="*.ashx" verb="*" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v2.0.50727\aspnet_isapi.dll" resourceType="Unspecified" requireAccess="Script" preCondition="classicMode,runtimeVersionv2.0,bitness64" responseBufferLimit="0" />
    <add name="SimpleHandlerFactory-ISAPI-4.0_32bit" path="*.ashx" verb="*" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" resourceType="Unspecified" requireAccess="Script" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
    <add name="SimpleHandlerFactory-ISAPI-4.0_64bit" path="*.ashx" verb="*" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" resourceType="Unspecified" requireAccess="Script" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
    <add name="SimpleHandlerFactory-Integrated" path="*.ashx" verb="*" type="System.Web.UI.SimpleHandlerFactory" resourceType="Unspecified" requireAccess="Script" preCondition="integratedMode,runtimeVersionv2.0" />
    <add name="SimpleHandlerFactory-Integrated-4.0" path="*.ashx" verb="*" type="System.Web.UI.SimpleHandlerFactory" resourceType="Unspecified" requireAccess="Script" preCondition="integratedMode,runtimeVersionv4.0" />
  </handlers>
  . . .
</system.webServer>

This ensures that the OPTIONS calls reach my .ashx and .svc code in which I can then set the correct headers.

This all works fine locally when I call the services from another domain, for example using js fiddle.

However, when I upload my application to Azure, it no longer works. Any OPTIONS requests return a 404 immediately.

It seems that the handler definitions used to forward the OPTIONS requests to my applications do not work on Azure.

My question is: what do I need to configure to make sure OPTIONS requests reach my application and can be handled there on Azure?

Answer 1

In the end I ended up removing the handlers as in my question, but adding two custom handlers:

<remove name="SimpleHandlerFactory-Integrated-4.0" />
<remove name="SimpleHandlerFactory-Integrated" />
<remove name="SimpleHandlerFactory-ISAPI-4.0_64bit" />
<remove name="SimpleHandlerFactory-ISAPI-4.0_32bit" />
<remove name="SimpleHandlerFactory-ISAPI-2.0-64" />
<remove name="SimpleHandlerFactory-ISAPI-2.0" />
<remove name="OPTIONSVerbHandler" />
<!-- Added the following handlers -->
<add name="AshxHandler" path="*.ashx" verb="*"
    type="System.Web.UI.SimpleHandlerFactory" resourceType="Unspecified"
    requireAccess="Script"/>
<add name="SvcHandler" path="*.svc" verb="*"
    type="System.Web.UI.SimpleHandlerFactory" resourceType="Unspecified"
    requireAccess="Script"/>

Another part of the answer was adding the OPTIONS operations in API Management. Using the CORS policy of API Management as suggested by Miao Jiang actually did not work and in fact breaks CORS in my situation when I include it now. I'm sure it will work for other situations though.

EDIT: I ended up using policies anyway, and it now works. No OPTIONS operations need to be added. I've used the following policy on API level:

<policies>
    <inbound>
        <base />
        <cors>
            <allowed-origins>
                <origin>*</origin>
            </allowed-origins>
            <allowed-methods>
                <method>GET</method>
                <method>POST</method>
                <method>OPTIONS</method>
            </allowed-methods>
            <allowed-headers>
                <header>*</header>
            </allowed-headers>
        </cors>
    </inbound>
    <outbound>
        <base />
    </outbound>
</policies>

Answer 2

I had a similar issue with OPTIONS request on an Web API running on Azure. There was a simple fix available:

1. In the Azure Portal, click on your App Service to open the management interface.
2. Scroll down the list of management options until you reach the 'API' section, and click on 'CORS'
3. Either enter the web address of the allowed origin, or enter '*' to allow all, and click Save.