AngularJS删除函数抛出404错误：无法找到指定API接口

问题原因 #

你的404错误是因为请求URL与Web API的路由规则不匹配。当前AngularJS发送的请求是/api/Student/Delete?id=1，但Web API默认路由规则无法匹配这个地址，导致找不到对应的接口方法。

两种可行解决方案 #

方案1：调整AngularJS请求URL，将ID放入路径（推荐） #

Web API默认路由模板为api/{controller}/{id}，id是路由参数而非查询参数。修改AngularJS代码，把学生ID直接拼接到URL路径中：

$scope.DeleteStudent = function (r) {
    debugger;
    $http.delete('/api/Student/' + r.StudentID)
        .then(function (responsedlt) {
            alert("Record deleted successfully !!");
        })
        .catch(function (error) {
            console.log("error is :" + error.statusText);
        });
}

同时确保你的Web API控制器类上有[RoutePrefix("api/Student")]属性（如果没有可以加上），方法保持不变：

[RoutePrefix("api/Student")]
public class StudentController : ApiController
{
    [HttpDelete]
    public HttpResponseMessage Delete(int id)
    {
        try
        {
            var _get = repos.deletebyid(id);
            if (_get != null)
            {
                return Request.CreateResponse(HttpStatusCode.OK, _get);
            }
            return Request.CreateErrorResponse(HttpStatusCode.BadRequest, "Error");
        }
        catch (Exception ex)
        {
            return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
        }
    }
}

方案2：修改Web API路由，适配查询参数格式 #

如果你想保留AngularJS当前的请求格式（用params传递ID），需要给Delete方法添加路由属性，明确指定匹配的URL：

[RoutePrefix("api/Student")]
public class StudentController : ApiController
{
    [HttpDelete]
    [Route("Delete")] // 明确路由匹配/api/Student/Delete
    public HttpResponseMessage Delete(int id)
    {
        try
        {
            var _get = repos.deletebyid(id);
            if (_get != null)
            {
                return Request.CreateResponse(HttpStatusCode.OK, _get);
            }
            return Request.CreateErrorResponse(HttpStatusCode.BadRequest, "Error");
        }
        catch (Exception ex)
        {
            return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
        }
    }
}

这样AngularJS原有的请求代码就可以正常匹配到接口了。

额外检查点 #

• 确认Web API的路由配置（WebApiConfig.cs）中启用了默认路由：

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

• 检查你的控制器类名是否为StudentController（Web API会自动去掉后缀Controller识别控制器名称）。

内容的提问来源于stack exchange，提问作者Suvarna