결제 연동 테스트 문의드립니다.
개발테스트 모듈을 적용하고 테스트 중인데, 결제를 한 이후에 테스트 결제 내역에 결제 건이 확인되지 않고 한참 후에 확인이 됩니다. 테스트 결제인 경우 실시간 연동이 안되는 건가요?
32 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
지금도 그러시나요? 일부 지연이 있긴하지만 한참이라고 느끼실 정도는 아닌것으로 알고 있습니다.
정확한 시점은 확인하지 못하였으나, 20분정도 후에 확인하니 나오는 듯하였습니다.
어제 오후는 내부적으로 동기화 지연이 있었는데, 지금다시한번 확인해 주실수 있을까요?
오전에 진행했던 것이긴한데.. 한번 더 테스트 하고 남겨보겠습니다!
그럼 진행하시고 바로 주문번호 공유 부탁드립니다.
지금 테스트 하고 있는데 결제 건이 나타나지 않습니다.
SuccessToss?orderId=UEMwMjIxMjAyM01UVk81Vw==&paymentKey=71DG90nOlP24xLea5zVAoWkPDJmlRK8QAMYNwW6BvjZdyEmJ&amount=192060
15분경 결제한 건입니다.
해당건에 대해서 승인 응답을 받으셨나요?
승인요청을 잘못보내시는 것 같습니다.
body를 querystring으로 보내신것 같은데, JSON 으로 보내주셔야 합니다.
해당 건에 대하여는 아직 승인 응답을 받지 못하였습니다. 결과 값으로는 success가 뜨는데 에러가 날 수가 있나요?
const TossPayProgress = async (randomId) => {
//Toss결제
tossPayments = await loadTossPayments(
${CONFIG.TossClientKey});
// 카드 결제 메서드 실행
tossPayments.requestPayment(카드, {
amount: varVoucherAmount, // 가격
orderId: ${randomId}, // 주문 id
orderName: ${varPaymentData.vo_name}, // 결제 이름
customerName: ${varCompanyName}, // 판매자, 판매처 이름
successUrl: ${CONFIG.PAYMENT_HOST}/SuccessToss, // 성공시 리다이렉트 주소
failUrl: ${CONFIG.PAYMENT_HOST}/FailToss, // 실패시 리다이렉트 주소
}).then(function(data) {
console.log(data);
}).catch(function (error) {
if (error.code === 'USER_CANCEL') { // 결제 고객이 결제창을 닫았을 때 에러 처리
alert('카드결제가 취소되었습니다.');
} else if (error.code === 'INVALID_CARD_COMPANY') { // 유효하지 않은 카드 코드에 대한 에러 처리
alert('카드결제진행중에 오류가 발생하였습니다. 재결제를 진행하시거나 관리자에게 문의해주세요.');
}
});
}SuccessURL 에서 paymentkey 를 받으신후에 다시 승인 API 를 호출하셔야 합니다.
현재 소스는 이렇게 되어있습니다.
응답을 잘못보낸 경우에는 fail이 뜨도록 처리를 해둔 상태입니다..
여기 말고 ${CONFIG.PAYMENT_HOST}/SuccessToss 쪽에서
RESTful api 로 "api.tosspayments.com/v1/payments/confirm" 으로 요청하시는 부분이 있으실겁니다.
그쪽 코드가 잘못되어 있으신것 같아요
결제창 연동하기 | 토스페이먼츠 개발자센터
카드, 계좌이체, 휴대폰, 상품권 결제를 연동하는 방법을 알아보세요.
여기를 참고해 주시기 바랍니다.
const ApprovalCardPayment = () => {
console.log(paymentKey,orderId,amount);
//secretKey encoding : 'test_sk_XjExPeJWYVQ0B49ydlg349R5gvNL' (tossPayment 페이지에서 엔코딩)
const url = "https://api.tosspayments.com/v1/payments/confirm";
$.ajax({
type: "POST",
url: url,
headers: {Authorization:
Basic dGVzdF9za19YakV4UGVKV1lWUTBCNDl5ZGxnMzQ5UjVndk5MOg==},
data: {"paymentKey":paymentKey,"orderId":orderId,"amount":amount},
dataType: 'json',
success: function(data, status, xhr){
console.log(data,status);
SaveCardPayment();
},
error: function(jqXHR, textStatus, errorThrown){
console.log('error',textStatus);
alert('연결오류\n정보 저장시 오류가 발생하였습니다!');
}
});
}
보내주신 SuccessToss쪽 소스코드를 보내드립니다.혹시 지금 보내주신 코드가 frontend 쪽에서 동작하는 JS 코드인가요?
네 맞습니다
승인 API 는 frontend에서 ajax 로 보내시면 secretkey 가 브라우저에 노출되기때문에 이렇게 호출하시면 안됩니다.
secretkey 를 누구나 확인할수 있으므로 다른사이트에서 어썸앱님의 상점으로 결제를 내거나 결제된 거래를 취소할수 있습니다.
그래서 승인 API 는 꼭 server2server로 호출하셔야 합니다.
그러면 저희가 결제 테스트를 하고 한참 후에 결제 건이 뜨는데 그 부분이 호출방식때문에 그렇다는 말씀이실까요?
아뇨. 그건 아니고 승인 API 를 호출하지 않으시기때문에 20분 후에 만료가 되어서 표시가 되는 겁니다.
결제 승인이 아예 되지 않으신거에요..
문제는 2가지 인데
- 승인 API 를 Ajax 로 보내시는것(이건 보안 문제가 있습니다)
- 승인 API 를 정상적으로 보내지 않으시는것
아아..
그럼 서버대서버로 통신한다면
서버에서 axios 를 써도 될까요? 아니면 curl등을 써야 하는 부분이실까요?
서버에서 axios 를 쓰시면 될겁니다.
그리고 보내주실때 header 'Content-Type: application/json' 가 추가 되어야 하고
지금 body에 data를 paymentKey=71DG90nOlP24xLea5zVAoWkPDJmlRK8QAMYNwW6BvjZdyEmJ&orderId=UEMwMjIxMjAyM01UVk81Vw%3D%3D&amount=192060
이렇게 보내고 계신데요.
{"paymentKey":"M7UTDlk1hFeqUNUirzTsU","amount":15000,"orderId":"dJcqtqK6U5pcY6bvpm3mT"}
이런식으로 JSON 형태로 보내주셔야 합니다.
위에 링크드린 가이드를 찬찬히 읽어 보시기 바랍니다.
넵 알겠습니다. 다시 작업해보고 말씀드리겠습니다. 감사합니다!
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.
axios 1.x버전 사용시 해당헤더는 불필요 합니다!
axios 1.x + await/async 사용 시 이렇게 호출하면 되는 것으로 알고 있습니다.
그래서 docs에 있는 해당 node.js 예시코드도 1.x 대응 문법으로 수정이 필요해 보여요
네 제안 감사드립니다. 다만 1.x 보다 낮은 버전을 사용하시는 분들도 있을수 있어 해당 코드가 있어서 1.x 버전에서 문제가 발생하는게 아니라면
0.x에서도 1.x 문법이 지원하는 것으로 알고 있습니다.
그대로 두는 것이 어떨까 싶은데요, 1.x 에서 content-type 이 있으면 동작에 문제가 있나요?
1.x에서 request와 같은 문법이 장기적으로 deprecated될 plan이 있는 것으로 알아서요.
있어도 상관은 없으나
간혹 charset이 깨져서 들어오는 이슈가 있습니다.
특히 window서버에서 돌아갈경우에 cp949로 찍히는 문제가 있어서 해당 경우 header에 추가로 charset정보를 추가하거나 아예 제거하는 방식으로 해결했던 적이 있어 남겨드린겁니다만
일반적인 linux환경에서는 있든 없든 발생하는 이슈는 없습니다~
네 해당 부분이 없어서 문제가 발생하는 경우가 아예 없는게 아니라면 명시적 설정이라 두는 편이 좋을 것 같다는게 개인적인 생각입니다만, 이부분은 docs 관리하는 팀에 공유하도록 하겠습니다. 좋은 의견 감사합니다.
감사합니다.
저는 단순히 0.x 후반부터 현재 1.x까지 사용되고 있는 신 문법이 코드가 더 깔끔하고 이용하기 쉽다는 장점이 있어 제안드린것입니다