I encountered a 404 error when using AngularJS's "$http.put" for a PUT request.
Below is my relevant AngularJS code:
/* toggles whether or not the link is disabled */
toggleLinkStatus: function (isActive, linkGUID) {
$http.put('/Explorer/Link/ToggleLinkStatus',
{
isActive: isActive,
linkGUID: linkGUID
}
);
}
Here is the corresponding C# Controller Code:
[HttpPut]
public IHttpActionResult ToggleLinkStatus(Boolean isActive, Guid linkGUID)
{
return Ok();
}
And here is my WebApiConfig Code:
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
/** define routes for Explorer API */
config.Routes.MapHttpRoute(
name: "ExplorerAPI",
routeTemplate: "Explorer/{controller}/{action}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
}
What could be missing here? The Request Payload in the Headers show that the data is being passed through successfully:
isActive: true
linkGUID: "b94badb3-2917-4129-9ae3-35d2a635f66d"
A normal query string PUT using POSTMAN works fine, but not with AngularJS.
UPDATE
An interesting finding is that the following AngularJS request goes through without errors:
/* toggles whether or not the link is disabled */
toggleLinkStatus: function (isActive, linkGUID) {
$http.put('/Explorer/Link/ToggleLinkStatus',
{
isActive: isActive,
linkGUID: linkGUID
},
{
params:
{
isActive: isActive,
linkGUID: linkGUID
}
}
);
}
It also works with this modification:
/* toggles whether or not the link is disabled */
toggleLinkStatus: function (isActive, linkGUID) {
$http.put('/Explorer/Link/ToggleLinkStatus',
{
},
{
params:
{
isActive: isActive,
linkGUID: linkGUID
}
}
);
}