xmlhttprequest cannot load response URL. for preflight has invalid http status code 405 for $http.delete

Question

I have web API service:

public void Delete(int id)
        {
}

Web api-Web.config

<httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
      </customHeaders>
    </httpProtocol>
    <validation validateIntegratedModeConfiguration="false" />
    <directoryBrowse enabled="true" />
    <modules runAllManagedModulesForAllRequests="true" />
    <handlers>
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
    </handlers>

when I use it using Postman (Chrome extension). I am passing data as 'form data'. And I get 200 return code. I have call this method using angularjs:

deletesurvey: function(surveyData) {
                var objFormData = new FormData();
                for (var key in surveyData)
                    objFormData.append(key, surveyData[key]);
                return $http.delete(configurationurl + 'Survey', objFormData, {
                    transformRequest: angular.identity,
                    headers: { 'Content-Type': undefined }
                });

i have set headers in my Web.Config:

<modules runAllManagedModulesForAllRequests="true" />
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Methods" value="GET,POST,PUT,HEAD,DELETE,OPTIONS" />
        <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
        <add name="Access-Control-Request-Methods" value="*" />
        <add name="Access-Control-Max-Age" value="1728000" />

      </customHeaders>
    </httpProtocol>

after it call deletesurvey function it is giving me error (Browser is Chrome) xmlhttprequest cannot load response URL for preflight has invalid http status code 405

The error message is about the preflight OPTIONS request, not the DELETE request which the browser never makes (because it doesn't get permission in the response to the OPTIONS request) — Quentin

Rogier Spieker Rogier Spieker · Accepted Answer · 2016-02-05T12:59:46

What appears to be happening is that the CORS 'preflight' request (which uses the OPTIONS method) is not/incorrectly handled by the server.

xmlhttprequest cannot load response URL. for preflight has invalid http status code 405 for $http.delete

1 Answers