Npay 주문형 연동하기

본 가이드는 스킨을 자체 제작하는 헤드리스를 위한 가이드 입니다.

Npay 구매 버튼 스크립트

플랫폼 유형에 알맞은 스크립트를 선택해 헤더 영역에 추가하세요

<!-- mobile -->
<script type="text/javascript" src="https://pay.naver.com/customer/js/mobile/naverPayButton.js"></script>

<!-- pc -->
<script type="text/javascript" src="https://pay.naver.com/customer/js/naverPayButton.js"></script>

Npay 구매 버튼 옵션 설정

옵션의 종류를 확인하고 알맞은 값을 추가하세요

네이버에서제공하는 스크립트를 분석해 작성한 내용입니다.

업데이트 시점에 따라 내용이 달라질 수 있으니 정확한 옵션에 대한 정보는 하기 스크립트를 확인하세요

// mobile
window.naver.NaverPayButton.apply({
    EMBED_ID: 'naver-pay',
    BUTTON_KEY: `${buttonKey}`,
    TYPE: 'MA',
    COLOR: 1,
    COUNT: 2,
    ENABLE: 'Y',
    BUY_BUTTON_HANDLER: {handleBuyButtonClick},
    WISHLIST_BUTTON_HANDLER: {handleWishListButtonClick},
  });
  
// pc
window.naver.NaverPayButton.apply({
    EMBED_ID: 'naver-pay',
    BUTTON_KEY: `${buttonKey}`,
    TYPE: 'A',
    COLOR: 1,
    COUNT: 1,
    ENABLE: 'Y',
    BUY_BUTTON_HANDLER: {handleBuyButtonClick},
    WISHLIST_BUTTON_HANDLER: {handleWishListButtonClick},
  });

  • EMBED_ID : Npay 구매 버튼 노출 할 영역의 id 값을 입력하세요. 예시)

<!-- EMBED_ID: 'naver-pay' -->
<div id="naver-pay"></div>

  • BUTTON_KEY : 네이버에서 전달받은 버튼 생성키

    • 관리자 > 설정 > 네이버페이 설정 > 네이버페이 주문형 > 버튼 인증키 에 입력한 값을 GET /order-configs 주문 설정 값 가져오기 API로 확인할 수 있습니다. 응답 값 중 naverPay.buttonKey를 사용하시면 됩니다.

  • TYPE : 플랫폼 유형에 따라 다르게 설

    • PC : A ~ G

      • F와 G를 설정하는 경우 스크립트 옵션을 확인하세요 F를 설정하는 경우 COLOR: 1, COUNT: 2 만 유효 G를 설정하는 경우 COLOR: 1, COUNT: 1 만 유효

      • 샵바이 기본 스킨에서는 A를 기본으로 사용합니다.

    • MOBILE : MA, MB

      • 샵바이 기본 스킨에서는 MA를 기본으로 사용합니다.

      • COLOR : 버튼 모음의 색 설정. 1 혹은 2 설정 가능

        • 샵바이 기본 스킨에서는 1를 기본으로 사용합니다.

      • COUNT : 버튼 개수 설정. 구매하기 버튼만 있으면 1, 찜하기 버튼도 있으면 2를 입력

        • 샵바이 기본 스킨에서는 2를 기본으로 사용합니다.

          • 단, 장바구니 페이지에서는 1로 고정해서 사용합니다. 찜하기 기능을 사용하지 않습니다.

      • ENABLE : 버튼 활성화 여부를 Y 혹은 N 으로 설정. 품절 등의 이유로 버튼 모음을 비활성화할 때에는 "N" 입력

      • BUY_BUTTON_HANDLER : NPay 구매 버튼 클릭 시 호출하는 핸들러

      • WISHLIST_BUTTON_HANDLER: 찜 하기 버튼 클릭 시 호출하는 핸들러

Previous글로벌 주문/환불 프로세스NextFAQ

Last updated

Was this helpful?