从 React App 调用 Web Api 时出现 System.InvalidOperationException 错误答案

【问题标题】：System.InvalidOperationException Error on Web Api call from React App从 React App 调用 Web Api 时出现 System.InvalidOperationException 错误
【发布时间】：2018-05-18 18:12:50
【问题描述】：

我有这两个 Web Api 控制器，我目前正在从反应应用程序调用控制器方法 GetSingle

    public IHttpActionResult GetAllData()
    {
        var modelitems = new List<TestModel>();

        var items = AWEntity.GetProducts();
        var i = 0;

        foreach (var item in items)
        {
            var model = new TestModel
            {
                Id = item.ProductId,
                TestName = item.Name,
                TestMessage = "My Message" + i,
                ReorderPoint = item.ReorderPoint
            };

            modelitems.Add(model);

            i++;
        }

        return Ok(modelitems);
    }

    public IHttpActionResult GetSingle()
    {
        var item = AWEntity.GetProduct();

        var model = new TestModel
        {
            Id = item.ProductId,
            TestName = item.Name,
            TestMessage = "My Message" + 1,
            ReorderPoint = item.ReorderPoint
        };

        return Ok(model);
    }

react fetch 看起来像这样

    fetch('http://localhost:51620/api/TestApi/GetSingle')
    .then(result => result.json())
    .then(result => {
      this.setState({
        items : result
      }
    )
  })

我的 WebApi 路由配置如下所示：

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

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

所以，我的问题是，每当我调用 GetSingle 方法时，我都会收到此错误在控制台中

    {
  "message": "An error has occurred.",
  "exceptionMessage": "Multiple actions were found that match the request: \r\nGetData on type WebAPIComponent.Controllers.TestApiController\r\nGetSingle on type WebAPIComponent.Controllers.TestApiController",
  "exceptionType": "System.InvalidOperationException",
  "stackTrace": "   at System.Web.Http.Controllers.ApiControllerActionSelector.ActionSelectorCacheItem.SelectAction(HttpControllerContext controllerContext)\r\n   at System.Web.Http.Controllers.ApiControllerActionSelector.SelectAction(HttpControllerContext controllerContext)\r\n   at System.Web.Http.ApiController.ExecuteAsync(HttpControllerContext controllerContext, CancellationToken cancellationToken)\r\n   at System.Web.Http.Dispatcher.HttpControllerDispatcher.<SendAsync>d__1.MoveNext()"
}

知道原因可能是什么，我尝试将另一条路由添加到默认路由，其中包括 action 参数，但这似乎不起作用，如果可能的话，我想避免使用自定义路由属性

非常感谢

【问题讨论】：

标签： asp.net-mvc reactjs asp.net-web-api asp.net-web-api2

【解决方案1】：

啊，我找到了答案，路由配置设置错误，带有动作的配置应该优先考虑

【讨论】：