쇼핑몰에 결제 기능을 연동하고 싶은데 어디서부터 시작해야 할지 막막하신가요? 쇼핑몰 결제 연동은 주문서 페이지부터 시작하면 돼요. 고객이 주문할 상품과 배송지 정보를 확인하고 결제수단을 선택할 수 있도록 주문서를 만든 다음, 결제창 연결과 승인 처리 기능을 구현하면 돼요.
이번 글에서는 주문서 구성부터 결제창 연결, 결제 승인, 운영 중 결제 UI 관리까지 쇼핑몰 결제 연동에 필요한 단계를 차근차근 알아볼게요.
결제 과정에서 고객이 만나게 되는 페이지는 크게 위 5가지예요. 이미 상품 리스트 페이지와 상품 상세 페이지가 만들어져 있다고 가정하고, 결제 연동이 시작되는 주문서 페이지부터 살펴볼게요.
1. 쇼핑몰 주문서에는 어떤 정보를 넣어야 하나요?
주문서에는 상품 정보, 배송지 정보, 할인 정보, 결제수단 선택, 결제 금액, 약관 동의 등 6가지 영역을 구성할 수 있어요. 고객이 주문 내용을 확인하고 원하는 결제수단을 선택할 수 있도록 각 영역을 구성하면 돼요.
- 상품 정보: 주문할 상품, 상품 옵션(크기·색상 등), 수량
- 배송지 정보: 배송지 주소, 구매자 이름, 전화번호 등
- 할인 정보: 포인트, 적립금, 쿠폰의 사용 여부와 사용 금액
- 결제수단 선택: 제공하는 결제수단, 카드사 혜택, 가상계좌 환불 정보
- 결제 금액: 주문 금액, 할인 적용 금액, 적립 금액, 배송비, 총 결제 금액
- 약관 동의: 결제 서비스 이용약관, 개인정보 수집 동의 등
이 중에서도 결제수단 선택 영역은 고객이 편리하게 결제하도록 만드는 데 중요한 부분이에요. 고객마다 사용하는 카드나 계좌가 다르기 때문에 다양한 결제수단을 제공하는 것이 좋아요. 간편결제도 함께 제공하면 고객이 익숙한 방식으로 결제할 수 있죠. 다만 결제수단 선택 영역은 실제 PG사와 연결되는 부분이라 기획과 디자인뿐 아니라 개발 작업도 필요해요.
카드, 계좌이체, 간편결제는 어떻게 연동하나요?
먼저 쇼핑몰에서 제공할 결제수단을 정하고, 각 수단에 맞는 결제창이 실행되도록 개발하면 돼요. 카드, 계좌이체, 가상계좌, 휴대폰결제, 간편결제 등 제공할 결제수단을 정리한 뒤 고객이 쉽게 선택할 수 있도록 화면을 기획하고 디자인하세요. 결제수단에 따라 추가로 구현해야 하는 기능도 달라요. 예를 들어 카드결제에는 할부 개월 선택 기능이 필요할 수 있고, 가상계좌에는 환불 계좌 정보나 입금기한을 설정하는 기능이 필요할 수 있어요.
쇼핑몰 주문서에는 어떤 약관을 넣어야 하나요?
결제 서비스 이용약관과 개인정보 관련 동의 등 필요한 약관을 표시하고, 고객의 동의 여부를 관리할 수 있도록 구현해야 해요. PG사를 이용한다면 해당 PG사의 전자결제 서비스 이용약관도 확인해 주세요. 필요한 약관을 정리해 주문서에 표시하고, 고객이 동의할 수 있도록 기능을 추가하면 돼요. 고객의 동의 여부를 저장하고 관리하는 것도 중요해요.
결제수단 선택 화면을 직접 개발하지 않고 만들 수 있나요?
네. 토스페이먼츠 결제위젯을 이용하면 결제수단 선택 UI를 처음부터 직접 디자인하고 개발하는 부담을 줄일 수 있어요. 혼자 개발해야 하거나 주문서 디자인에 많은 시간을 쓰기 어렵다면 결제위젯에서 제공하는 UI를 활용할 수 있어요. 쇼핑몰 브랜드에 맞게 디자인을 커스텀할 수 있고, 지원되는 설정은 어드민에서 관리할 수 있어요.
카드 할부 개월 선택, 가상계좌의 환불 계좌 정보와 입금기한 설정, 쇼핑몰의 필수 이용약관과 회원·비회원 약관 등도 결제위젯에서 지원하는 기능을 활용할 수 있어요.
개발자는 이미 만들어진 결제 UI를 메서드 하나로 화면에 표시할 수 있어요. 결제위젯 연동 방법은 아래 개발자 문서에서 확인할 수 있어요.
2. 쇼핑몰 결제창은 어떻게 연결하나요?
주문서에서 고객이 선택한 결제수단과 결제 정보를 바탕으로 해당 결제창이 실행되도록 연결하면 돼요. 결제수단마다 필요한 메서드와 파라미터가 다를 수 있으므로 각 수단에 맞게 설정해야 해요.
결제창을 실행하기 전에 무엇을 저장해야 하나요?
결제 요청 전에 주문 ID와 주문 금액 등 결제에 필요한 정보를 데이터베이스(DB)에 저장해 두는 것이 중요해요. 카드, 가상계좌, 휴대폰결제, 간편결제 등 고객이 선택한 결제수단에 맞는 메서드와 파라미터를 연결해 결제창을 실행하도록 구현하세요.
결제 요청 전에는 주문 ID와 주문 금액 등 최초의 주문 정보를 서버에 저장하고 관리해야 해요. 이후 실제 결제 요청에 포함된 금액과 서버에 저장된 주문 금액을 비교하면 클라이언트에서 결제 금액이 임의로 변경되는 문제를 방지하는 데 도움이 돼요.
결제 인증 결과는 어떻게 받을 수 있나요?
리다이렉트 URL을 설정하면 결제 요청에 대한 인증 결과를 전달받을 수 있어요. 결제수단에 따라 인증이 필요한 경우 고객의 인증이 끝난 뒤 결과를 전달받을 URL을 설정해야 해요. 전달받은 인증 결과를 확인한 다음 최종 결제 승인 절차를 진행하면 돼요. 인증 결과를 받았다고 해서 결제가 모두 완료된 것은 아니에요. 최종 승인 요청까지 정상적으로 처리되어야 결제가 완료돼요.
결제 요청과 인증, 승인 단계가 헷갈린다면 아래 글도 참고해 보세요.
고객이 선택한 카드사나 간편결제 화면을 바로 띄울 수 있나요?
토스페이먼츠의 결제 연동 기능을 활용하면 지원되는 결제수단의 결제창을 실행하도록 구성할 수 있어요. 예를 들어 고객이 카드결제를 선택했다면 연동 방식에 따라 해당 카드사의 결제창으로 연결되도록 구현할 수 있어요.
고객이 선택한 결제수단의 화면으로 자연스럽게 연결되면 결제 과정을 간결하게 구성하는 데 도움이 돼요. 다만 실제 화면과 이동 방식은 결제수단과 연동 방식에 따라 달라질 수 있어요.
3. 결제 승인은 어떻게 처리하고 완료 페이지는 어떻게 만드나요?
인증 후 전달받은 정보로 승인 API를 호출하고, 승인 결과를 확인한 뒤 결제 완료 페이지로 이동하도록 구현하면 돼요. 승인 결과에 따라 주문 상태와 결제 정보를 관리하는 기능도 함께 구현해야 해요.
결제 승인 요청은 어떻게 구현하나요?
인증 결과를 바탕으로 승인 API를 호출하고, 응답 결과를 데이터베이스에 저장하면 돼요. 결제가 정상적으로 승인됐는지 확인한 뒤 그 결과를 데이터베이스에 저장하고, 주문 상태와 결제 정보를 일관되게 관리하도록 구현하세요.
결제 완료 페이지는 어떻게 만들어야 하나요?
결제가 정상적으로 승인된 경우 고객이 주문 결과를 확인할 수 있는 페이지를 보여주면 돼요. 주문 상품과 결제 금액, 주문 번호 등 고객에게 필요한 정보를 표시할 수 있어요.
결제 완료 화면은 고객이 주문 결과를 확인하는 용도예요. 실제 주문 완료 여부는 화면 이동만으로 판단하지 말고, 서버에서 확인한 결제 승인 결과를 기준으로 처리해야 해요. 결제가 정상적으로 완료됐다면 상품 발송 등 후속 절차를 진행하면 돼요.
4. 결제수단이나 결제 UI를 변경하려면 매번 개발해야 하나요?
꼭 그렇지는 않아요. 토스페이먼츠 결제위젯에서 지원하는 설정 기능을 이용하면 일부 변경 사항을 어드민에서 관리할 수 있어요. 쇼핑몰을 운영하다 보면 특정 결제수단을 추가하거나 제외하고 싶을 수 있고, 프로모션 배지를 적용하거나 결제 화면을 조정해야 할 수도 있어요.
결제위젯을 이용하면 지원되는 항목에 대해 어드민에서 결제 UI를 설정할 수 있어요. 기본적인 디자인 변경뿐 아니라 쇼핑몰 약관 등 일부 항목도 지원 범위 안에서 관리할 수 있죠. 다만 변경할 수 있는 항목과 설정 방법은 이용 중인 서비스와 연동 환경에 따라 달라질 수 있어요.
쇼핑몰 결제 연동을 쉽게 시작하려면 어떻게 해야 하나요?
주문서 구성부터 결제수단 연결, 승인 처리, 운영·관리까지 필요한 단계를 먼저 정리하고, 결제위젯처럼 제공되는 기능을 활용하면 개발 부담을 줄일 수 있어요.
쇼핑몰 결제 연동은 주문서 화면을 만드는 것에서 끝나지 않아요. 결제수단별 요청 처리와 인증, 승인, 결제 완료 처리까지 연결해야 하고, 운영 중에는 결제 UI와 약관 등을 관리해야 하죠.
토스페이먼츠 결제위젯을 이용하면 이미 만들어진 UI를 연동하고 지원되는 설정을 어드민에서 관리할 수 있어요. 직접 개발해야 하는 범위를 줄이고 싶다면 결제위젯 연동 가이드부터 확인해 보세요.
토스페이먼츠의 모든 콘텐츠는 사업자에게 도움이 될 만한 일반적인 정보를 참고 목적으로 제공하고 있어요. 구체적인 사안에 관한 자문을 대신하지 않으며, 콘텐츠에서 취득한 정보로 인해 발생한 손해에 대해 법적 책임을 부담하지 않아요.
ⓒ 토스페이먼츠. 무단 전재 및 배포 금지.
