AI상품추천:데이터호출형 모든페이지(이지웰)

1. 시스템 구조도

---

2. 개요

• 스크립트 LOAD 완료된 후 원하는 시점에 추천 상품 목록을 가져와서 사용할 수 있습니다.

• 추천에 필요한 데이터만 전달 하는것으로 고객사 화면에 맞는 디자인을 구성 하셔야 됩니다.

---

3. 연동 방식

• 고객사에서 그루비에서 추천 상품 요청 시 데이터를 바로 전달합니다.

• 비동기식이라 요청이 느려졌을 경우 html에 추천 리스트를 표현하지 못하는 경우가 존재합니다.

groobee.getGroobeeKeyBaseRecommendAsync("캠페인키", "추천타입", "타입에따른 기준값", 타임아웃, 필터링정보).then( data =>  { console.log(data); } );    

---

4. 어드민 설정

키(Key) 기반 추천 상품 조회를 사용할 경우 새로운 AI 추천 생성 시 무조건 모든페이지(데이터호출형)을 사용해야만 합니다.

모든 페이지(데이터 호출형)을 선택 후 나오는 추천 유형은 getGroobeeKeyBaseRecommendAsync에서 사용할 추천 종류(recommendBaseType)와 똑같이 맞춰주셔야 합니다.

---

5. 키(Key) 기반 추천 상품 조회(getGroobeeKeyBaseRecommendAsync)

• 고객사에서 추천 상품 요청 시 전달해주는 함수입니다.

• 정의

  • 역할: 추천 상품 조회

  • 함수명: groobee.getGroobeeKeyBaseRecommendAsync

• 파라미터

항목	타입	필수	설명
campaignKey	string	Y	캠페인키
recommendBaseType	string	Y	추천 종류(대문자) CATEGORY, GOODS, KEYWORD
recommendValue	string	Y	recommendBaseType에 따른 기준값 CATEGORY : "카테고리코드" 입력 GOODS : "상품코드" 입력 KEYWORD : "검색어" 입력
timeSet	int	Y	타임아웃 시간 (기본 1000ms)
{}	object	Y	이지웰 추천 필터링 정보 (하위 참조)

카테고리 추천을 원하시는 경우 recommendBaseType을 CATEGORY로 하고, recommendValue에 대,중,소,세 카테고리중 하나의 카테고리 코드값을 넣어 주시면 됩니다.

전문관 노출이나 선물하기 추천의 경우 아래 필터링 정보를 확인하셔서 필터링 정보에 데이터를 넣어주세요.

— 이지웰 추천 필터링 정보(object) – 재구축(마켓/체크인 제외)

필드명	타입	필수	설명
channel	string	N	고객사 채널정보
category	string	N	채널이 101, 102, 106 일때 필요.
point	int	N	고객사 포인트
vendorCd	string	Y	고객사 코드
cnt	int	N	상품응답 개수
fallbackAlgorithmList	array<string>	N	폴백 알고리즘 리스트(하단의 알고리즘 리스트 참조)
giftYn	string	N	선물하기 추천 요청시 Y로 요청

cnt 필드를 보내주지 않으시면 이지웰에 설정된 최대 200개의 상품이 내려갑니다.

전체 상품을 추천하시려면 channel에 빈값을 넣어주시고, vendorCd에 고객사 코드만 넣어주세요.

vendorCd로만 필터해서 재구축, 마켓, 체크인의 상품중에 추천이 됩니다.

채널이 브랜드몰(101), 5대복지(102), 전문관(106) 일때는 category에 카테고리를 넣어주세요.

선물하기 페이지에서 호출하실때는 채널값은 빈값으로 해서 giftYn에 Y를 넣어서 호출 해 주세요.

— 이지웰 추천 필터링 정보(object) – 대응개발(마켓)

필드명	타입	필수	설명
vendorType	string	Y	대응개발 구분값 - 고정값 : MARKET
channel	string	N	고객사 채널정보
vendorCd	string	Y	고객사 코드
cnt	int	N	상품응답 개수
fallbackAlgorithmList	array<string>	N	폴백 알고리즘 리스트(하단의 알고리즘 리스트 참조)

cnt 필드를 보내주지 않으시면 이지웰에 설정된 최대 200개의 상품이 내려갑니다.

— 이지웰 추천 필터링 정보(object) – 대응개발(체크인)

필드명	타입	필수	설명
vendorType	string	Y	대응개발 구분값 - 고정값 : CHECK_IN
channel	string	N	고객사 채널정보
cityCd	string	N	도시코드
areaCd	string	N	지역코드
roomType	string	N	숙소유형
roomClass	string	N	숙소등급
vendorCd	string	Y	고객사 코드
cnt	int	N	상품 응답 개수
fallbackAlgorithmList	array<string>	N	폴백 알고리즘 리스트(하단의 알고리즘 리스트 참조)

cnt 필드를 보내주지 않으시면 이지웰에 설정된 최대 200 개의 상품이 내려갑니다.

— 이지웰 추천 필터링 정보(object) – 대응개발(해외패키지)

필드명	타입	필수	설명
vendorType	string	Y	대응개발 구분값 - 고정값 : TRIP
cityCds	array<string>	N	도시코드
areaCd	string	Y	국가코드
vendorCd	string	Y	고객사 코드
cnt	int	N	상품 응답 개수

cnt 필드를 보내주지 않으시면 이지웰에 설정된 최대 200개의 상품이 내려갑니다.

---

폴백 알고리즘 리스트

캠페인별로 특정 폴백알고리즘을 노출하기 원하시면 아래 8개 알고리즘 코드 중 선택해서 넣어주시면 됩니다. ex)

"fallbackAlgorithmList" : ["ST02"] - ST02 상품이 내려갑니다.

"fallbackAlgorithmList" : ["ST02", "ST04"] - ST02, ST04 둘중 하나가 랜덤하게 내려갑니다.

알고리즘 코드	설명
ST02	많이 본 상품 TOP N
ST03	많이 구매한 상품 TOP N
ST04	추천 클릭률 TOP N
ST05	실시간 많이 본 TOP N
ST06	주문 전환율 TOP N
ST07	추천 유입률 TOP N
ST09	많이 담은 상품 TOP N
ST10	실시간 많이 구매한 TOP N

작성 예

//추천 필터링 정보
let queryObj = {
       "channel" : "LG"
     , "point" : 300000
     , "vendorCd" : "A001"
     , "cnt" : 5
     , "fallbackAlgorithmList" : ["ST02","ST04","ST06","ST07","ST09"]
};

groobee.getGroobeeKeyBaseRecommendAsync("캠페인키","CATEGORY", "카테고리코드", 3000, queryObj).then(data =>  { console.log(data); });
 
groobee.getGroobeeKeyBaseRecommendAsync("캠페인키","GOODS", "상품코드", 3000, queryObj).then(data =>  { console.log(data); });
 
groobee.getGroobeeKeyBaseRecommendAsync("캠페인키","KEYWORD", "검색어", 3000, queryObj).then(data => { console.log(data); });

결과 값

{
    "campaignKey": "캠페인키",
    "algorithmCd": "ST09",
    "goodsList": [
        {
            "serviceKey": "서비스키",
            "goodsNm": "[해외배송] 베르사체 오디세아 스니커즈 1015437-1A10925-2R44P White- Palladium",
            "goodsCd": "1011032410403",
            "goodsImg": "https://contents-qa.ezwelfare.net/ezwel-image/welfare_shop/upload/2025/06/16/7v4bLVxiMdNsTCwzp9FmlD…",
            "goodsCateNm": "해외직구",
            "goodsCate": "70020608",
            "goodsPrc": 1380000,
            "goodsSalePrc": 717000
        },
        ...
    ]
}

---

6. DI(노출)

• 실제 고객사에서 노출시킨 상품 정보를 그루비로 보내줍니다.

• 그루비로 노출시킨 상품 정보를 보내주면 통계에 집계되어 어드민에서 확인 가능합니다.

• 정의

  • 역할: 전시되는 상품을 그루비에서 노출 처리

  • 함수명: groobee.send

• 파라미터

항목	타입	필수	설명
type	string	Y	노출 코드("DI" 고정 값)
{}	object	Y	노출 관련 object (하위참조)

— 노출 관련 object

필드명	타입	필수	설명
algorithmCd	string	Y	알고리즘 코드
campaignKey	string	Y	추천 캠페인키
campaignTypeCd	string	Y	캠페인 타입("RE" 고정 값)
goods	array<object>	Y	실제로 노출된 상품 코드 리스트 (하위참조) [ { goodsCd: "상품코드1" }, {}, ... ]

— goods 배열 내부 객체 구조 (실제로 노출된 상품 코드 리스트)

필드명	타입	필수	설명
goodsCd	string	Y	상품 코드

groobeeObj = {
   algorithmCd : "알고리즘코드",
   campaignKey : "추천캠페인키",
   campaignTypeCd : "RE", //고정
   goods: [      
      {goodsCd: "노출된 상품코드1"},
      {goodsCd: "노출된 상품코드2"},
      ...
      ]
}

groobee.send("DI", groobeeObj);

---

7. CL(클릭)

• 고객이 클릭한 상품 정보를 그루비로 보내줍니다.

• 고객이 클릭한 상품 정보를 그루비로 보내주면 통계에 집계되어 어드민에서 확인 가능합니다.

• 정의

  • 역할: 고객이 클릭한 상품을 그루비에서 클릭 처리

  • 함수명: groobee.send

• 파라미터

항목	타입	필수	설명
type	string	Y	클릭 코드("CL" 고정 값)
{}	object	Y	클릭 관련 object (하위참조)

— 클릭 관련 object

필드명	타입	필수	설명
algorithmCd	string	Y	알고리즘 코드
campaignKey	string	Y	추천 캠페인키
campaignTypeCd	string	Y	캠페인 타입("RE" 고정 값)
goods	array<object>	Y	실제로 클릭된 상품 코드 (하위참조) [ { goodsCd: "상품코드1" }]

— goods 배열 내부 객체 구조 (실제로 클릭된 상품 코드)

필드명	타입	필수	설명
goodsCd	string	Y	상품 코드 (실제 클릭한 상품 1개)

groobeeObj = {
   algorithmCd : "알고리즘코드",
   campaignKey : "추천캠페인키",
   campaignTypeCd : "RE", //고정
   goods: [
        {goodsCd: "고객이 클릭한 상품코드"}
        ]
}

groobee.send("CL", groobeeObj);

---

8. 사용 가능 알고리즘 정의

• 사용 가능한 알고리즘을 확인합니다.

RecommendBaseType	Algorithm
CATEGORY(카테고리 기반)	1. 카테고리 TOP N 2. 실시간 카테고리 TOP N 3. 연관 카테고리 상품
GOODS(상품 기반)	1. 함께 본 상품 2. 함께 구매한 상품 3. 함께 담은 상품 4. 구매 패턴 유사 상품 5. 상품명 기반 유사 상품 6. 딥러닝 기반 유사 상품 7. 연관 카테고리 상품 8. 이미지 기반 유사 상품 9. 딥러닝 기반 다음에 볼 상품
KEYWORD(검색어 기반)	1. 검색어 추천

---

9. 작성 예시

코드 작성 예시를 보여줍니다.

//작성 예시일 뿐 고객사의 코드에 맞게 수정해주시면 됩니다.
//아래 코드가 정답이 아닙니다. 참고만 부탁드립니다.
function groobeeRecommendCall () {
    //추천 필터링 정보
    let queryObj = {
            "channel" : "LG"
            , "point" : 300000
            , "vendorCd" : "A001"
            , "cnt" : 5
    };
    //함수가 존재하는지 체크
    if (groobee && groobee.getGroobeeKeyBaseRecommendAsync) {
        //groobee.getGroobeeKeyBaseRecommendAsync 함수를 정상적으로 호출이 될 경우
        groobee.getGroobeeKeyBaseRecommendAsync('RE21e2804f900d463182fe847210b14a49',"GOODS", "1011032410403", 3000, queryObj).then(data => {
                고객사처리함수(data);
      })
    }  else {
        //groobee.getGroobeeKeyBaseRecommendAsync 함수가 정상적으로 호출이 되지 않을 경우
        let tryCnt = 0;
        let _timer = setInterval(()=> {
            // 3회 넘어갈시 중지
            if(tryCnt==3){
                clearInterval(_timer);
                $('#지정된ID').hide();
                return;
            }
            tryCnt++;
            // function 존재시에만 실행
            if(groobee.getGroobeeKeyBaseRecommendAsync && typeof groobee.getGroobeeKeyBaseRecommendAsync == 'function') {
                clearInterval(_timer);
                groobee.getGroobeeKeyBaseRecommendAsync('RE21e2804f900d463182fe847210b14a49', "GOODS", "1011032410403", 3000, queryObj).then(data = > {
                        고객사처리함수(data);
                })
            }
        } , 500);
  }
}
function 고객사처리함수(data) {
  console.log('recommendData :::', data);
  if (data && data.goodsList) {
    //고객사 추천상품 노출 및 데이터처리
    ...code 
    /*
      추천 상품 선별 및 노출작업
      각 상품 클릭 시 이벤트 연결처리도 필요 아래 clickGroobeeProduct(함수명은 자유)
      예시일 뿐 고객사에 맞춰서 코드는 새로 작성할 것
    */
    let html = "<ul>"; 
    for (let i = 0; i < data.goodsList.length; i++) { 
      html += `<li onClick="clickGroobeeProduct(${data.algorithmCd}, ${data.campaignKey}, 
 ${data.goodsList[i].goodsCd})">${data.goodsList[i].goodsNm}</li>`; 
     }
    html += "</ul>";
    $('#지정된ID').append(html);
    $('#지정된ID').show();
    --------------groobee 노출(DI) 처리 START----------------
    groobeeDisplayInsert(data.campaignKey, data.algorithmCd, data.goodsList);
    --------------groobee 노출(DI) 처리 END------------------
  } else {
    $('#지정된ID').hide();
  }
}
function groobeeDisplayInsert(type, campignKey, algorithmCd, goodsList) {
  //상품목록이 존재하는지 체크
  if (!goodsList || goodsList.length == 0) return;
  //이전에 goodsCd만 가공해서 보냈다면 1번 방식을 그게 아니라면 2번 방식을 채택하시면됩니다.
  //1. let goods = goodsList;
  //2. let goods = [];
    let goods = goodsList;
    for (let i = 0; i < goodsList.length; i++) {
      let newObj = {goodsCd: goodsList[i].goodsCd};
      goods.push(newObj);
    } 
  let groobeeObj = {
    algorithmCd: algorithmCd, //알고리즘코드 (추천받을때 받은 algorithmCd)
    campaignKey: campaignKey, //캠페인키
    campaignTypeCd: 'RE',     //고정값
    goods: goods
  }
  groobee.send('DI', groobeeObj);
}
function clickGroobeeProduct(campaignKey, algorithmCd, goodsCd) {
  //추천 클릭처리
  let groobeeObj = {
    algorithmCd: algorithmCd, //알고리즘코드 (추천받을때 받은 algorithmCd)
    campaignKey: campaignKey, //캠페인키
    campaignTypeCd: 'RE',     //고정값
    goods: [
      {goodsCd: goodsCd}
    ]
  }
  groobee.send('CL', groobeeObj);
  //고객사 페이지 이동처리
  code....

---

10. 변경이력

버전	날짜	변경이력	담당자
1.01	2025.10.17	초안작성	김상훈
1.02	2025.10.22	필터항목의 필수 여부 수정	김상훈
1.03	2025.10.28	체크인 필터링 항목 필수 여부 변경 (도시코드, 지역코드, 숙소유형, 숙소등급 : Y → N )	김상훈
1.04	2025.11.06	필터 필드 fallbackAlgorithmList 추가	이도환
1.05	2025.11.12	재구축 필터링 정보에 category, giftYn 추가	김상훈
1.06	2025.12.12	대응개발(해외패키지) 추천 필터링 정보 추가	이도환