구방문방구 | 상품목록 페이지네이션(offset, limit), 검색

1. 페이지네이션

상품 리스트를 구현하면서 카테고리에 해당하는 모든 상품의 데이터를 보내도록 구현했는데 상품이 아주 많을 경우에 대비해서 한번에 보내는 데이터의 양을 offset, limit으로 제한을 하는 방식으로 수정을 했다.(추가구현)

 

limit과 offset은 sql에서 페이징할때 사용하는 용어인데 offset은 시작위치, limit은 가져올 열의 수이다.

이걸 파이썬 리스트 슬라이싱에 활용하면 list[offset : offset+limit]으로 쓸 수 있다.

쿼리셋은 리스트처럼 인덱스로 슬라이싱을 할 수 있으니까 기존 상품목록에 슬라이싱만 하면 되는데 아직 프론트에서 상품목록이 완성이 되지 않아서 offset, limit값이 없으면 전체상품을 출력하는 방법으로 구현을 했다. 

 

기본값: 전체페이지

offset = request.GET.get('offset', None)
limit  = request.GET.get('limit', None)

if offset: 
    offset = int(offset)
else: 
    offset = 0
if limit: 
    limit = int(limit)
else: 
    limit = total_products - offset  # total_products=products.count()
            
products = products[ offset : offset + limit ]

page_data = {
    'current_page' : math.floor( (offset + limit) / limit ),
    'next'    : None if offset + limit > total_products else f'/products/{category.id}?limit={limit}&offset={offset+limit}',
    'previous': None if offset - limit < 0              else f'/products/{category.id}?limit={limit}&offset={offset-limit}'
}

쿼리 파라미터로 받은 값을 뽑으면 값이 스트링으로 오기 때문에 int형으로 바꿔주고

offset값이 없으면 처음부터, limit이 없으면 끝까지 출력되도록 기본값을 줬다.

그리고 현재페이지가 몇페이지인지, 이전페이지와 다음페이지의 경로를 어떻게 요청해야 하는지도 리턴되도록 page_data를 만들었다.

 

리뷰후

위처럼 작성하고 코드리뷰를 받았는데 ProductListView는 상품 목록을 보내주는 기능을 하기 때문에 해당 기능만 하는 것이 좋고 이전페이지 다음페이지 등의 정보를 뷰 안에서 계산해서 리턴해주는것은 적합하지 않다는 피드백을 받았다.

offset과 limit값은 프론트에서 설정하고 백엔드에서는 들어오는 각 값에 따른 결과만 출력하도록 바꿨다. 그리고 기본값으로는 전체목록을 출력하는 것에서 첫페이지를 출력하는 것으로 수정했다. 

offset = int(request.GET.get('offset', 0))
limit  = int(request.GET.get('limit', 12))

    ...

products = products.order_by(sort_by[request.GET.get('sorting', None)])[offset:offset+limit]

 

그래서 이렇게 간단하게 바뀌었다.

 

이전/다음페이지까지 같이 리턴해주려고 열심히 산수를 했던 코드가 사라졌지만 고민했던 과정이 재밌어서 괜찮다....

 

 

 

 

2. 상품검색

검색기능을 검색한 키워드가 상품명에 포함되는 상품목록을 불러오는 것이기 때문에 뷰를 분리하지 않고 ProductListView에서 같이 작성했다.

 

장고 쿼리셋 api의 contains를 이용해서 간단히 구현했다.

검색 키워드가 들어오지 않을때 기본값을 빈 문자열로 해서 모든 상품이 products에 들어가도록 했다.

keyword = request.GET.get('search', '')
    ...
products = Product.objects.filter(name__contains=keyword)
# 검색은 전체상품 기준으로 해서 여기만 필터를 추가했다

if category_id != 1000:
    products = Product.objects.filter(category_id=category_id)
    
    ...