AngularJs：$http.post 总是返回 404 错误答案

【问题标题】：AngularJs: $http.post always return 404 errorAngularJs：$http.post 总是返回 404 错误
【发布时间】：2017-01-18 03:01:59
【问题描述】：

我目前正在尝试开发一个简单的 Angular js 应用程序。我正在尝试将数据从客户端发布到 web api。但是，当我从 Angular 应用程序发出发布请求时，我收到 404 错误。

以下是我的发帖请求，

 $http.post('/api/LoadApi/', jsonData).then(function (result) {
                console.log(result.data);
            })
           .catch(function (error) {
           });

其中 jsonData 是有效的 json 数据。

我的 web api 代码是这样的，

public class LoadApiController : ApiController
{
    [HttpPost]
    public HttpResponseMessage LoadData(object dataToLoad)
    {
        var response = Request.CreateResponse(HttpStatusCode.Created);

        return response;
    }
}

我的 web api 路由配置是这样的，

config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{dataToLoad}"
            );

但是，当我运行代码时，它会引发错误

“/”应用程序中的服务器错误。无法找到该资源。说明：HTTP 404。您要查找的资源（或其依赖项之一）可能已被删除、名称已更改或暂时不可用。请查看以下 URL 并确保其拼写正确。请求的 URL：/api/LoadApi/

谁能指出上述代码有什么问题？

它说 url 有问题。生成的 url 是http://localhost:14154/api/LoadApi/，看起来是正确的。

【问题讨论】：

您的路由模板无法工作，因为它没有定义您要匹配的控制器上的哪个操作。
另外，您不要使用POST 来发送 URL 字符串上的数据。

标签： javascript angularjs asp.net-web-api asp.net-web-api2

【解决方案1】：

问题在于您的路由定义以及您如何尝试将数据发送到控制器方法。我建议使用基于属性的路由。在您的 Web API 控制器中执行以下操作：

[RoutePrefix("api/LoadApi")]
public class LoadApiController : ApiController
{
    [HttpPost]
    [Route("loadData")]
    public HttpResponseMessage LoadData(object dataToLoad)
    {
        var response = Request.CreateResponse(HttpStatusCode.Created);
        return response;
    }
}

将Global.asax.cs中的Application_Start()方法改成这样：

protected void Application_Start()
{
    GlobalConfiguration.Configure(WebApiConfig.Register);
}

确保App_Start 中的WebApiConfig.cs 具有这样的Register() 方法：

public static void Register(HttpConfiguration config)
{
    config.MapHttpAttributeRoutes();
}

最后将您的 $http.post 调用更改为：

$http.post('/api/LoadApi/loadData', jsonData).then([...]);

【讨论】：