간편 결제 API - PortOne

 

 

 

 

 

 

 

PortOne 소개

 

간편 결제를 위한 API

* 원래 명칭은 아임포트였으나,  포트원으로 명칭이 변경되었다.

 

 

 

 

 

 

 

📌 포트원 사이트 방문하기

포트원 관리자콘솔

 

 

 

 

 

 

 

 

 

---

 

 

 

 

 

사용하기 전에

 

 

 

 

버전 선택

 

포트원 버전은 v1 그리고  v2 버전이 존재하는데 각각 사용방법이 다르다.

이번 포스팅에선 v1 기준으로 포스팅을 해보았다 👀

 

 

 

📌 1. 포트원 라이브러리 추가 (portone.io)

 

 

 

 

 

 

 

 

 

결제사 선택하기 

 

포트원에 회원가입후  " 결제 연동  " 페이지로 이동한다.

좌측 사이드바 메뉴중 결제 연동버튼을 누르면 이동할 수 있다.

 

 

📌 결제 연동 | 테스트/실 연동 관리 (portone.io)

 

 

 

 

 

 

 

 

 

다음과 같이 결제대행사를 추가해주자.

 

 

 

 

 

결제사 선택이 끝났다 👏👏

 

 

 

 

 

 

 

 

 

 

 

 

---

 

 

 

 

 

 

 

 

사용해보기

 

포트원 결제 연동 페이지 우측 상단에있는 " 내 식별코드 · API Keys " 를 클릭하고

 

우측 사이드바에 있는 내용중 " 가맹점 식별코드 "에 imp로 적혀있는 값들을 복사해주기 !

 

 

 

 

 

 

---

 

✍ 코드펜으로 테스트 해보기

 

See the Pen Untitled by minwoo (@ko0or) on CodePen.

 

버튼을 눌렀는데 아무 반응도 없을경우

✅ Check 1 - 코드펜 수정 화면에서 IMP.init() 매개변수에 본인의 가맹점 식별코드를 넣었는지 확인
코드펜 우측상단에 있는 " EDIT ON CODEPEN " 버튼을 눌러주세요 .
그리고 좌측 HTML 영역에 있는 코드중 IMP.init("imp로 시작하는 숫자번호 입력"); 라는 곳에 복사했던 가맹점 식별코드를 붙여넣어줘야 버튼이 동작됩니다.

✅ Check 2 - 포트원 사이트에서 결제대행사를 추가했는지 확인 (토스페이, 토스페이먼츠, 카카오페이)

 

   

 

 

 

 

---

 

 

 

 

 

 

코드펜 우측 상단에 EDIT ON CODE PEN을 클릭

 

 

새로 열린 페이지에서  좌측 HTML  영역에있는 스크립트 태그가 있다.

그중에서  IMP.init("imp로 시작하는 숫자번호 입력");  내용에 복사했던 값을 붙여넣어주면 된다 😀

 

 

만약, imp로 시작하는 가맹점 식별번호를 복붙했는데도 안된다면
본 포스팅의 " 결제사 선택하기 "에서 결제사를 추가해주었는지 확인해보기 👀

 

 

 

 

 

 

 

 

 

---

 

 

 

 

 

PG사 코드표

 

이번 포스팅에선 토스페이, 토스페이먼츠, 카카오페이 3개만 테스트해보았다.

 

사실, 이외 다른 결제사도 테스트해볼 수 있다.

포트원 페이지에서 사용하고싶은 결제사를 추가해주고,  해당 결제사의 코드를 사용해주면된다.

* 코드펜에서 토스페이는 tosspay,  토스페이먼츠는 tosspayments, 카카오페이는 kakaopay 라고 사용했던것처럼

 

 

결제사의 코드표는 다음 사이트에서 직접 확인할 수 있다 👀

 

🔍 PG사 코드표 (portone.io)

PG사 코드표