ASP.Net MVC application throws 403 error while making a Web API call

Question

I have this problem with an MVC application that has a class descended from ApiController :

[Authorize]
public class WidgetController : ApiController
{
    // POST: api/Widget/GetWidgets
    [HttpPost]
    [ActionName("GetWidgets")]
    public List<WidgetItem> GetWidgets(WidgetQueryParams parms)
    {
        // ...
    }

    // ...
}

This is configured in WebApiConfig.cs:

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        config.Filters.Add(new ExceptionHandlingAttribute());

        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "WidgetApi",
            routeTemplate: "api/{controller}/{action}/{id}",
            defaults: new {id = RouteParameter.Optional }
        );

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{id}",
            defaults: new {id = RouteParameter.Optional }
        );
    }
}

The method is called from JavaScript built on top of AngularJS:

function () {
    'use strict';

    angular.module('WidgetApp').factory('DataContext', ['$http', '$q', DataContext]);

    function DataContext($http, $q) {
        var service = {
            // ...
            WebAPIPostWithData: WebAPIPostWithData,
            // ...
        };
        return service;
    
        function WebApiPostWithData(Controller, Action, data) {
            var url = "api/" + Controller + "/" + Action;
            var deferred = $q.defer();

            $http.post(url, data)
                .success(function (httpResult) {
                    deferred.resuilve(httpResult);
                }).error(response) {
                    deferred.reject(response);
                    throw "Exception: DataContext/WebAPIPostWithData - Error while calling the url '" + url + "'. Message: " + response.ExceptionMessage;
                })
            return deferred.promise;
        }
    }
})();

At run time, the JavaScript gets down into DataContext.WebAPIPostWithData() and calls $http.post() . When the call returns, I see the code stop at the breakpoint I put on the .error() function and the response is a 403 error. As an experiment, I modified the code in the WidgetController so the GetWidgets() method was decorated as an [HttpGet] method instead of [HttpPost] and the program stopped at my breakpoint in that method.

I'm at a complete loss at this point. Why does the call return a 403 error when it's called as an HTTP POST operation but works fine when called as an HTTP GET operation? Does anyone have any ideas on what might be wrong?

Answer 1

It could be a CORS pre-flight check error. GET request don't have these restrictions, however POST requests do. With pre-flight check errors, it usually says that. Can you check if it works in Postman? If it works in Postman, but doesn't in your app, then that's another indication that it's a pre-flight check issue.

You may find the below answer useful as well: Response for preflight 403 forbidden

Answer 2

Perhaps you have permission to read from the API but not write to it?