ASP.NET MVC购物车商品数量更新与删除功能故障求助

以下是针对你购物车功能失效问题的具体修复步骤：

1. 解决CSRF验证拦截问题 #

ASP.NET Core默认会拦截未携带CSRF令牌的POST请求，这是导致表单提交失败的常见原因。需要在每个POST表单中添加CSRF令牌：

修改视图中的两个表单，添加asp-antiforgery="true"属性，同时用asp-for替代手动写name属性，避免拼写错误：

<!-- 更新数量表单 -->
<form asp-controller="Cart" asp-action="UpdateCartItemQuantity" method="post" asp-antiforgery="true">
    <input type="hidden" asp-for="@item.Id" />
    <input type="number" asp-for="@item.Quantity" min="1" />
    <button type="submit">Update</button>
</form>

<!-- 删除商品表单 -->
<form asp-controller="Cart" asp-action="RemoveFromCart" method="post" asp-antiforgery="true">
    <input type="hidden" asp-for="@item.Id" />
    <button type="submit">Remove</button>
</form>

2. 修复服务层的总价计算逻辑 #

当前服务层仅更新数量，未同步更新商品单项总价和购物车总金额，导致页面刷新后数据显示异常。修改服务层方法：

更新数量方法 #

public async Task<bool> UpdateCartItemQuantityAsync(int cartItemId, int newQuantity)
{
    // 关联查询购物车信息，用于更新总金额
    var cartItem = await context.CartsItems
        .Include(ci => ci.Cart)
        .FirstOrDefaultAsync(ci => ci.Id == cartItemId);

    if (cartItem != null)
    {
        cartItem.Quantity = newQuantity;
        // 计算当前商品的单项总价
        cartItem.TotalPrice = cartItem.ProductPrice * newQuantity;
        // 重新计算购物车总金额
        cartItem.Cart.GrandTotal = cartItem.Cart.CartsItems.Sum(ci => ci.TotalPrice);
        
        await context.SaveChangesAsync();
        return true;
    }

    return false;
}

删除商品方法 #

public async Task<bool> RemoveCartItemFromCartAsync(int cartItemId)
{
    var cartItem = await context.CartsItems
        .Include(ci => ci.Cart)
        .FirstOrDefaultAsync(ci => ci.Id == cartItemId);

    if (cartItem != null)
    {
        var cart = cartItem.Cart;
        context.CartsItems.Remove(cartItem);
        // 删除后重新计算购物车总金额
        cart.GrandTotal = cart.CartsItems.Sum(ci => ci.TotalPrice);
        
        await context.SaveChangesAsync();
        return true;
    }

    return false;
}

3. 确保购物车视图的Get方法正确构建ViewModel #

返回购物车页面时，需要重新计算所有商品的单项总价和购物车总金额，确保页面显示最新数据：

public async Task<IActionResult> Cart()
{
    // 获取当前用户ID（根据你的身份认证方式调整）
    var userId = User.FindFirstValue(ClaimTypes.NameIdentifier);
    if (string.IsNullOrEmpty(userId))
    {
        return View(new CartViewModel());
    }

    // 查询当前用户的购物车及关联商品
    var cart = await context.Carts
        .Include(c => c.CartsItems)
        .FirstOrDefaultAsync(c => c.UserId == userId);

    var viewModel = new CartViewModel();
    if (cart != null)
    {
        viewModel.Id = cart.Id;
        viewModel.UserId = cart.UserId;
        // 计算购物车总金额
        viewModel.GrandTotal = cart.CartsItems.Sum(ci => ci.ProductPrice * ci.Quantity);
        // 构建商品项ViewModel，同步计算单项总价
        viewModel.CartItems = cart.CartsItems.Select(ci => new CartItemViewModel
        {
            Id = ci.Id,
            ProductId = ci.ProductId,
            ProductName = ci.ProductName,
            ProductImageUrl = ci.ProductImageUrl,
            Quantity = ci.Quantity,
            ProductPrice = ci.ProductPrice,
            TotalPrice = ci.ProductPrice * ci.Quantity,
            CartId = ci.CartId
        });
    }

    return View(viewModel);
}

4. 额外检查项 #

• 确认你的Cart和CartItem实体类中包含TotalPrice（商品单项总价）和GrandTotal（购物车总金额）字段，且已正确映射到数据库。
• 测试时打开浏览器开发者工具（F12），查看Network标签下的POST请求状态码，若返回400/403，优先检查CSRF令牌是否正确添加。

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