Medusa-Payment-Tosspayments

Documentation
|
Website

Feature

결제 승인
Medusa's Next.js starter storefront와 통합

⚠️ Under Development

결제위젯과 브랜드페이는 아직 지원하지 않습니다.
토스페이먼츠 API 버전은 2022-11-16만 지원하고 있습니다.
현재 카드 결제 방식만 지원하고 있습니다. (아래 표 참고)

결제 방식	카드	가상계좌	계좌이체	휴대폰 결제	상품권	해외 간편결제
지원 여부	✅	🚫	🚫	🚫	🚫	🚫

Prerequisites

Installation

아래 명령어를 통해 Medusa backend에 plugin을 설치해주세요.

1
npm install medusa-payment-tosspayments --save

아래와 같이 환경 변수를 설정해주세요.

123
TOSSPAYMENTS_DEBUG=true # 디버깅용 로그가 필요하지 않는 경우 false로 설정해주시면 됩니다.
TOSSPAYMENTS_KEY=<API 개발 연동 시크릿 키>
TOSSPAYMENTS_VERSION=2022-11-16 # 2024-08-22 현재 가장 최신 API 버전

[!WARNING]
Copy to clipboardTOSSPAYMENTS_KEY에는 Tosspayments Docs 에서 base64로 인코딩된 키가 필요합니다.

Copy to clipboardmedusa-config.js에 있는 plugins 항목에 아래와 같이 설치한 Copy to clipboardmedusa-payment-tosspayments를 추가해주세요.

123456789101112
const plugins = [
  //...
  {
    resolve: "medusa-payment-tosspayments",
    options: {
      is_debug: process.env.TOSSPAYMENTS_DEBUG,
      tosspayments_key: process.env.TOSSPAYMENTS_KEY,
      tosspayments_version: process.env.TOSSPAYMENTS_VERSION,
    },
  },
  //...
];

Client Side

Medusa's Next.js starter storefront 에서 사용하는 기준으로 설명이 적혀있습니다.

먼저 Copy to clipboard@tosspayments/tosspayments-sdk를 설치해주세요.
React Context를 생성하여 checkout 페이지에서 Tosspayments 인스턴스를 정상적으로 불러올 수 있도록 합니다.
action에서 payments 결제 승인을 위한 데이터를 주고 받기 위해 업데이트를 해줄 수 있는 함수를 생성합니다. 자세한 내용은 Medusa Docs에서 확인해주세요.
Tosspayments 결제창을 실행할 수 있는 버튼을 생성합니다.
Admin 페이지에서 결제 수단에 tosspayments를 추가하고 버튼을 확인할 수 있습니다.

Reference

Build your own plugins

Develop your own plugins with our API to speed up your processes.

Make your plugin available via npm for it to be shared in our Plugin Library with the broader Medusa community.

Built by

Category

Version

Last updated