Ajax 发布到控制器操作在 Chrome 控制台中给出“500（内部服务器错误）”错误答案

【问题标题】：Ajax post to controller action gives "500 (Internal Server Error)" error in Chrome consoleAjax 发布到控制器操作在 Chrome 控制台中给出“500（内部服务器错误）”错误
【发布时间】：2017-03-01 16:40:01
【问题描述】：

我正在构建一个购物车，并且我有一个成功的方法可以将商品添加到 ShoppingCart。但是，为了删除这些项目，我使用了一个不成功的 Ajax 调用并给出以下错误：

POST http://localhost:62745/ShoppingCart/RemoveFromCart 500 (Internal Server Error)

remove 按钮链接应该调用 ShoppingCart 控制器中的 RemoveFromCart() 方法，接收一个 Json 对象并更新几个页面元素。我在这个论坛上尝试过建议，但没有帮助：http://mvcmusicstore.codeplex.com/discussions/244052

我也按照这个教程来构建购物车：https://docs.microsoft.com/en-us/aspnet/mvc/overview/older-versions/mvc-music-store/mvc-music-store-part-8

这是购物车页面中的 Javascript：

<script src="/Scripts/jquery-3.1.1.min.js"
        type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        // Document.ready -> link up remove event handler
        $(".RemoveLink").click(function () {
            // Get the id from the link
            var recordToDelete = $(this).attr("data-id");
            if (recordToDelete != '') {
                // Perform the ajax post
                $.post("/ShoppingCart/RemoveFromCart", { "id": recordToDelete },
                    function (data) {
                        // Successful requests get here
                        // Update the page elements
                        if (data.ItemCount == 0) {
                            $('#row-' + data.DeleteId).fadeOut('slow');
                        } else {
                            $('#item-count-' + data.DeleteId).text(data.ItemCount);
                        }
                        $('#cart-total').text(data.CartTotal);
                        $('#update-message').text(data.Message);
                        $('#cart-status').text('Cart (' + data.CartCount + ')');
                    });
            }
        });
    });
</script>

删除链接将与 ShoppingCart 页面中的每个新商品一起显示在第四 <td> 列：

 @foreach (var item in Model.CartItems)
    {
        <tr id="row-@item.RecordId">
            <td>
                @item.Product.Name
            </td>
            <td>
                @item.Product.Price
            </td>
            <td id="item-count-@item.RecordId">
                @item.Count
            </td>
            <td>
                <a href="#" class="RemoveLink" data-id="@item.RecordId">Remove</a>
            </td>
        </tr>
    }

以下是 ShoppingCartController 中应在 javascript 中调用的 RemoveFromCart 方法：

// AJAX: /ShoppingCart/RemoveFromCart/5
        [HttpPost]
        public ActionResult RemoveFromCart(int id)
        {
            var cart = ShoppingCart.GetShoppingCart(this.HttpContext);
            var productName = db.Carts.Single(c => c.ProductId == id).Product.Name;

            int itemCount = cart.RemoveItemFromCart(id);

            var results = new ShoppingCartRemoveViewModel
            {
                Message = Server.HtmlEncode(productName) +
                    " has been removed from your shopping cart.",
                CartTotal = cart.GetTotal(),
                CartCount = cart.GetCount(),
                ItemCount = itemCount,
                DeleteId = id
            };

            return Json(results);
        }

【问题讨论】：

你必须调试你的控制器动作。
我能想象的唯一原因是您的 javascript 在视图中是混合的，因此它正在创建一个数组并尝试传递数组而不是单个值如果您确定传递的参数一切都很好并且您传递单个整数，请记住 jquery .attr 返回字符串，而不是 int。这并不重要，因为它应该由 ASP.NET MVC 数据绑定器解析。但是，您可以尝试使用 jquery 将传递的值解析为 Int，或者将方法中的 id 类型从 int 更改为字符串类型。
500 (Internal Server Error) 表示控制器方法正在抛出异常。使用浏览器工具 - 网络选项卡 - 检查将提供异常详细信息的响应。

标签： javascript ajax asp.net-mvc

【解决方案1】：

您似乎正在尝试调用将 id 作为发布请求正文的一部分传递的操作。如果您查看操作 // AJAX: /ShoppingCart/RemoveFromCart/5 上方的评论，您会看到路由器希望它成为 url 的一部分。

尝试改变

$.post("/ShoppingCart/RemoveFromCart/", { "id": recordToDelete }

到

$.post("/ShoppingCart/RemoveFromCart/"+recordToDelete,

【讨论】：

在这种情况下没关系。只有当他在绑定的 id 参数旁边有“FromBody”时才会这样做

【解决方案2】：

RemoveFromCart() 方法中存在错误。此方法采用 Cart 对象的 RecordId 的参数，该参数是要删除的购物车项目的主键。我假设方法的参数是购物车表的 ProductId 属性：

var productName = db.Carts.Single(c => c.ProductId == id).Product.Name;

我将 c.ProductId 更改为 c.RecordId，因为它是 Cart 表的主键，它允许我从正在删除的购物车项目中获取产品名称。

【讨论】：