상품진열 영역
쇼핑몰 메인페이지 화면 내 '상품진열' 영역에 대한 정책과 기능, 사용할 수 있는 API를 소개합니다.
Last updated
쇼핑몰 메인페이지 화면 내 '상품진열' 영역에 대한 정책과 기능, 사용할 수 있는 API를 소개합니다.
Last updated
상품진열 영역이란, 메인 페이지 내에서 특별한 목적에 따라 상품 리스트를 노출하기 위한 공간입니다. 최초 쇼핑몰 생성 시, 세팅되는 상품 진열명은 '신규상품, 인기상품, MD추천, HOT, EVENT'로 구성됩니다.
오로라 개별형 기본 스킨 메인 화면에는 플랫폼(PC, 모바일) 별로 각 5개의 상품진열이 설정되어 있습니다. 상품진열은 플랫폼별(PC, 모바일)로 설정이 가능하며, 스킨에 접속한 디바이스 구분에 따라 설정한 상품진열을 조회하여 노출합니다.
설정된 상품진열의 사용여부, 전시하고자 하는 상품 리스트 등 관련 설정은 아래 어드민 경로에서 관리할 수 있습니다.
기본 스킨에서는 설정된 상품진열을 진열ID(sectionId)로 조회하여 노출하고 있습니다.
기본으로 세팅되는 상품진열의 진열ID는 아래와 같습니다. 정해진 아래 진열ID를 소스 내 하드코딩하여 각 섹션의 위치를 구분할 수 있습니다.
PC : SCPC0001, SCPC0002, SCPC0003, SCPC0004, SCPC0005
Mobile: SCMO0001, SCMO0002, SCMO0003, SCMO0004, SCMO0005
GET / display/sections/{sectionNo}
► 진열번호 기준으로 상품진열 조회하기 상품 진열 번호(sectionNo)을 기준으로 상품 진열을 조회하는 API입니다.
진열번호(sectionNo): 상품진열 등록 시 부여되는 유일값으로 모든 상품진열에 존재하는 값입니다.
GET /display/sections/ids/{sectionId}
▶ 진열ID 기준으로 상품진열 조회하기 상품 진열ID(sectionId)을 기준으로 상품 진열을 조회하는 API입니다.
진열ID(sectionId): 진열번호 외에 다른 기준으로 호출이 필요할 경우 사용할 수 있는 값입니다. 어드민에서 쇼핑몰 별 중복체크를 지원하므로, 다른 쇼핑몰에서 사용하는 값으로 상품진열 ID를 사용하실 수 있습니다.
쇼핑몰 생성 시, 오로라 개별형 기본 스킨에는 기본으로 세팅되는 PC 5개, 모바일 5개의 상품진열코드만 반영이 되어 있습니다.
기본스킨에서 제공하는 상품진열 외에 추가로 노출하고자 할 경우, 어드민에서 상품 진열을 등록한 후 노출하고자 하는 상품진열의 번호 또는 ID로 조회하여 노출할 수 있습니다.
진열번호, 진열ID 모두 진열 별로 API를 호출하여 상품 리스트를 가져오기 때문에, 상품진열 개수 별로 각각 API호출을 진행하셔야 합니다. 즉, 기본 스킨에서는 상품진열 5개 SCPC0001 ~ SCPC0005를 모두 사용하기 때문에, 총 5번의 해당 API 호출이 발생합니다
상품진열 내 전시된 상품에 대해 제공되는 '좋아요' 및 '장바구니' 기능을 소개합니다.
어드민내에서 상품을 전시하는 방식(=디스플레이 유형)에 따라 '좋아요' 및 '장바구니' 기능 제공 여부가 다릅니다.
상품진열의 '디스플레이 유형'은 어드민에서 설정 가능합니다.
각 디스플레이 유형에 따라 가로 또는 세로 상품노출 개수는 고정되어 있으며, 고정되지 않은 방향의 상품 노출 개수만 어드민에서 설정 가능합니다.
좋아요 기능은 일종의 위시리스트 개념으로, 해당 상품에 대한 단순 좋아요(like-products)를 표시할 수 있습니다. 따라서 주문서 페이지와 바로 연결하여 결제가 이루어지는 장바구니(cart)와 사용 목적이 구분됩니다.
좋아요 기능은 쇼핑몰 회원(member)의 경우에만 사용 가능하므로, 버튼 클릭 시 로그인 여부를 확인해야 합니다.
비회원(guest)
비회원의 경우 좋아요 기능을 지원하지 않습니다.
좋아요 버튼 클릭 시 로그인 여부를 확인하여, 미로그인(비회원)시 서비스이용불가 안내창 노출 후 로그인 페이지로 현재창 이동해야 합니다.
회원(member)
로그인한 상태에서 좋아요 버튼 클릭 시, 아래 POST /profile/like-products를 호출합니다.
해당 API로 좋아요가 적용된 상품은 마이페이지_쇼핑정보 내 '좋아요' 리스트에 추가됩니다.
▶ 회원이 상품을 좋아한다고 추가/삭제하기 회원이 좋아요한 상품을 목록에 추가하거나 삭제합니다
선택한 상품을 옵션 단위로 장바구니에 추가하는 기능입니다. 상품진열 디스플레이 유형 중 'PC-리스트형', 'PC-장바구니형'인 경우에만 '장바구니' 버튼이 제공됩니다.
Ⓑ 상품 옵션 선택 레이어 팝업을 노출하기 위한 버튼입니다. 단, 성인 인증 상품일 경우 회원/비회원 여부를 확인하여 필요 시 로그인 화면으로 이동시켜야 합니다. 로그인 이후에는 성인 인증 여부를 확인하는 컨펌창이 필요합니다.
오로라 개별형 기본 스킨에서는 장바구니 버튼 버튼 클릭 시, 상품 옵션을 선택할 수 있는 레이어 팝업이 출력됩니다. 상품 옵션 구현 방법은 상품 상세화면의 '옵션' 항목과 동일하니, 해당 문서를 참고하시길 바랍니다.
참고로, Ⓑ상품 옵션을 선택할 수 있는 레이어 팝업이 출력되는 점을 제외하고 아래 안내 드릴 메인 페이지 내 Ⓒ '장바구니 담기 버튼' 호출 로직은 상품 상세화면 내 '장바구니 버튼' 호출 로직과 동일합니다
장바구니 버튼 기능은 쇼핑몰 회원 여부와 상관없이 제공합니다. 단, 회원인 경우에만 API를 호출하며 비회원인 경우 API 호출이 아닌 localStorage에 자체적으로 저장합니다.
회원(member)
로그인한 상태에서 장바구니 담기 버튼 클릭 시, 아래 POST /cart를 호출하여 선택한 상품의 옵션이 장바구니에 추가됩니다.
▶ 장바구니 등록하기 로그인 회원의 상품 구매 수량과 옵션을 장바구니에 등록합니다.
비회원(guest)
비회원인 경우에도 장바구니 담기 버튼을 제공합니다.
단, API 호출이 아닌 localStorage 내 비회원 장바구니 데이터를 자체적으로 관리해야 합니다.
localStorage에 비회원 장바구니 데이터 저장 시, POST /cart의 request body와 동일한 데이터 형식으로 저장해야 합니다. 이후 상품 상세화면 혹은 장바구니 화면에서 주문서 호출 시 request 형식을 통일하기 위한 목적입니다.
바로구매 버튼 클릭 시 우선 로그인 여부를 확인하여, 만약 미로그인(비회원)일 경우 비회원 주문을 진행합니다. 로그인한 회원일 경우 아래 POST /order-sheets API로 주문서를 생성한 뒤 주문서 화면으로 이동합니다.
► 주문서 작성하기 선태한 상품의 옵션에 대한 주문서를 생성합니다.
주문서를 생성하는 API로 주문서 화면으로 이동하기 전 단계에서 호출해야 합니다. 해당 API에서 응답 값으로 획득한 주문서 번호 orderSheetNo 를 주문서 화면으로 전달합니다. 비회원 주문인 경우 accessToken을 null로 보냅니다.
