포트원 API 결제 연동이 안 됩니다

Question

포트원 API를 사용해서 결제를 진행하려고 합니다.버튼을 클릭하면 해당 값을 받아 결제 창으로 넘기려고 하는데, 결제창이 아예 안 뜨네요console.log를 통해 const response가 아예 작동하지 않는다는 건 확인했는데(앞뒤로 로깅메세지를 찍으니 앞에 것만 뜹니다) 왜 안되는지는 문서를 봐도 잘 모르겠습니다. 글도 예전의 아임포트 기준으로 쓰여진 게 많아서 답답하네요. 혹시 이유를 아시는 분 계시면 알려주시면 감사하겠습니다.storeId/channelKey는 임의의 값으로 적어두긴 했는데, 실제로는 모두 발급받은 키를 입력했습니다.

더미 · Answer

문제 분석포트원 결제창이 뜨지 않는 문제는 주로 다음과 같은 원인들 때문에 발생할 수 있습니다.포트원 SDK 로드 문제: browser-sdk.js 파일이 제대로 로드되지 않았거나, 로드되기 전에 PortOne.requestPayment 함수를 호출했을 수 있습니다.포트원 API 키 문제: storeId 또는 channelKey 값이 유효하지 않거나, 포트원 콘솔에서 설정한 값과 일치하지 않을 수 있습니다.requestPayment 함수 호출 문제: requestPayment 함수에 전달된 파라미터 값이 유효하지 않거나, 필수 파라미터가 누락되었을 수 있습니다.CORS 문제: 서버(SERVER_BASE_URL)와의 통신에서 CORS(Cross-Origin Resource Sharing) 문제가 발생했을 수 있습니다.해결 방안1. 포트원 SDK 로드 확인browser-sdk.js 파일이 태그 내에 포함되어 있는지 확인합니다.PortOne.requestPayment 함수 호출 전에 browser-sdk.js 파일이 완전히 로드되었는지 확인합니다. 다음과 같이 window.onload 이벤트를 사용할 수 있습니다.JavaScriptwindow.onload = function() { // 페이지 로드 완료 후 실행될 코드 const button = document.getElementById('paymentButton'); // 결제 버튼 ID button.addEventListener('click', () => requestPayment(button)); }; 2. 포트원 API 키 확인포트원 콘솔에서 발급받은 storeId 및 channelKey 값이 정확한지 다시 한번 확인합니다.스크립트에서 사용하는 값과 콘솔에서 설정한 값이 일치하는지 확인합니다.3. requestPayment 함수 호출 확인requestPayment 함수에 전달되는 모든 파라미터 값이 유효한지 확인합니다. 특히, totalAmount 값이 숫자인지, currency 값이 "CURRENCY_KRW"인지 확인합니다.필수 파라미터(storeId, channelKey, paymentId, orderName, totalAmount, currency, payMethod)가 모두 전달되었는지 확인합니다.4. CORS 문제 해결서버(SERVER_BASE_URL)에서 CORS를 허용하도록 설정합니다. 서버 응답 헤더에 다음과 같은 내용을 추가해야 합니다.Access-Control-Allow-Origin: * Access-Control-Allow-Methods: POST Access-Control-Allow-Headers: Content-Type 브라우저 개발자 도구의 네트워크 탭에서 서버 응답 헤더를 확인하여 CORS 관련 에러가 발생하는지 확인합니다.추가적인 디버깅브라우저 개발자 도구의 콘솔 탭에서 자바스크립트 에러 메시지를 확인합니다.requestPayment 함수 호출 후 response 객체의 값을 콘솔에 출력하여 API 응답 결과를 확인합니다.포트원 기술 지원팀에 문의하여 추가적인 도움을 받습니다.개선된 코드 예시JavaScript 참고: 위 코드는 예시이며, 실제 환경에 맞게 수정해야 합니다. 특히, paymentId는 고유한 값을 생성하는 로직을 추가해야 합니다.이러한 해결 방안들을 통해 문제를 해결하고 포트원 결제 기능을 성공적으로 구현할 수 있기를 바랍니다. 궁금한 점이나 추가적인 도움이 필요하면 언제든지 질문하세요!

HJOW · Answer

보통 이런 건 API를 제공하는 곳에다 물어보는 게 확실해요.걔내 서버가 일시적으로 맛이 갔을수도 있으니까요.그보다 요새는 AI 응답도 제법 그럴싸해지고 있네요.

Dive_Drink_Develope · Answer

콘솔 메시지를 전체적으로 확인해봐야 할것같은데... 코드가 전반적으로 옳다는 가정하에button value가 혹시 comma가 들어간 스트링으로 되어있을수도 있겠다 싶긴합니다.

포트원 API 결제 연동이 안 됩니다

3개의 답변

Q&A 목록