I am watching a tutorial about ECommerce Website with .Net Core – and the project is of type Web Assembly Blazor and I checked the .NET CORE Hosted, so the project spited to Client, Server and Sheared.

And the Cart model is consists of CartId, ProductId and UserId.

    public class CartItem
    {
        public int CartId { get; set; }
        public int UserId { get; set; }
        public int ProductId { get; set; }
        public int Quantity { get; set; } = 1;
    }

When the instructor implemented the Cart Model he was using the local storage only on the client side and he gets the Product details with a one server Call

Server service

    public interface ICartService
    {
        Task<ServiceResponse<List<CartProductResponse>>> GetCartProducts(List<CartItem> cartItems);
    }

Client service

    public interface ICartService
    {
        event Action OnChange;
        Task AddToCart(CartItem cartItem);
        Task<List<CartItem>> GetCartItems();
        Task<List<CartProductResponse>> GetCartProducts(); 
        Task RemoveProductFromCart(int productId, int productTypeId);
        Task UpdateQuantity(CartProductResponse product);
    }

So until now every thing make sense in my brian, all CURD operations are mainly on the Client side. But after he did the migration of local storage to the database. The CRUD operations are on both client and server side

Server service

    public interface ICartService
    {
        Task<ServiceResponse<List<CartProductResponse>>> GetCartProducts(List<CartItem> cartItems);
        Task<ServiceResponse<List<CartProductResponse>>> StoreCartItems(List<CartItem> cartItems);
        Task<ServiceResponse<int>> GetCartItemsCount();
        Task<ServiceResponse<List<CartProductResponse>>> GetDbCartProducts();
        Task<ServiceResponse<bool>> AddToCart(CartItem cartItem);
        Task<ServiceResponse<bool>> UpdateQuantity(CartItem cartItem);
        Task<ServiceResponse<bool>> RemoveItemFromCart(int productId, int productTypeId);
    }

Client service

public interface ICartService
{
   event Action OnChange;
   Task AddToCart(CartItem cartItem);
   Task<List<CartProductResponse>> GetCartProducts();
   Task RemoveProductFromCart(int productId, int productTypeId);
   Task UpdateQuantity(CartProductResponse product);
   Task StoreCartItems(bool emptyLocalCart);
   Task GetCartItemsCount();
}

My questions is:

Is that Ok/practical? having a call to the server on each cart change/update?

My suggestion:

if we could update the server side on section ends or on checkout only, but i have no idea if this possible or not

Both options (individual updates and batch update on checkout) are possible and practical.

Individual cart actions are usually not a problem because they:

  • Typically represent a small fraction of total requests to the site.
  • They are high value requests – meaning that it’s more likely this user is going to purchase, hence provide monetary value to the site.
  • They are not difficult to handle – in all likelihood they are just CRUD operations – for example you wouldn’t typically do credit cart processing on cart operations.

The main issue with managing a cart in local storage (only) is device migration – specifically that the user starts filling a cart on their phone and switches to their laptop – since the data is stored on their phone the data isn’t available on their laptop. How much of an issue this is for any given website will be dependent on usage patterns of the users of that site – for some sites this will be minor for others it may be significant.

TL;DR – It depends on the use cases for the site.

Khám phá các thẻ bài đăng