혹시 카드관련해서요
데이터 저장하려고하는데
private CardRequest card;로
@Getter @Setter public static class CardRequest { private String number; private String issuerCode; private String acquirerCode; private String installmentPlanMonths; private String approveNo; private String cardType; private String ownerType; private String acquireStatus; private String isInterestFree; private String interestPayer; private BigDecimal amount; } 만들었는데 가져오는 과정에서 Failed to execute 'json' on 'Response': Unexpected end of JSON input에러가 발생하는데 그렇다고 값이 안들어오는것도 아니고 issuerCode등 출력이 되는데 관련 내용 찾아 보긴했는데 혹시 리액트 문제 일까요? 리액트는 예제에서 거의 수정을 안해서요 // Authorization 토큰 가져오기 (예: 로컬 스토리지에서) const token = getCookie('accessToken'); async function confirm() { const requestData = { orderId: searchParams.get("orderId"), amount: searchParams.get("amount"), paymentKey: searchParams.get("paymentKey"), }; const response = await fetch("/api/confirm/widget", { method: "POST", headers: { Authorization:
@Getter @Setter public static class CardRequest { private String number; private String issuerCode; private String acquirerCode; private String installmentPlanMonths; private String approveNo; private String cardType; private String ownerType; private String acquireStatus; private String isInterestFree; private String interestPayer; private BigDecimal amount; } 만들었는데 가져오는 과정에서 Failed to execute 'json' on 'Response': Unexpected end of JSON input에러가 발생하는데 그렇다고 값이 안들어오는것도 아니고 issuerCode등 출력이 되는데 관련 내용 찾아 보긴했는데 혹시 리액트 문제 일까요? 리액트는 예제에서 거의 수정을 안해서요 // Authorization 토큰 가져오기 (예: 로컬 스토리지에서) const token = getCookie('accessToken'); async function confirm() { const requestData = { orderId: searchParams.get("orderId"), amount: searchParams.get("amount"), paymentKey: searchParams.get("paymentKey"), }; const response = await fetch("/api/confirm/widget", { method: "POST", headers: { Authorization:
Bearer ${token} ,// Authorization 헤더 추가
"Content-Type": "application/json",
},
body: JSON.stringify(requestData),
});
const json = await response.json();
if (!response.ok) {
throw { message: json.message, code: json.code };
}
return json;
}
confirm()
.then((data) => {
setResponseData(data);
})
.catch((error) => {
navigate(/fail?code=${error.code}&message=${error.message});
});
}, [searchParams]);
혹시 관련내용해서 질문 받으셨는지 궁금해서 질문남겨봅니다.27 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
결제는 성공으로 잘뜹니다
issuerCode 등이 출력된다면 json 파싱 문제라고 보기도 어려울 것 같은데요. 응답값 text로 확인해보셨나요?
java 단에서 디버깅으로 확인했습니다
카드에서 전체 값을 가져오기전 저에러가 발생해버려요
그럼 java에서 승인 api 호출한 걸 리액트에서 다시 호출하는 것으로 보이는데 java에서 응답값 내려줄때 헤더 json으로 내려주시나요?
네 맞습니다
아잠시만요
ResponseEntity.status(code).body(tossPaymentDto); 이렇게 넘깁니다
그럼 리액트에서 response를 json으로 넘기기전에 출력해서 확인해보셔야할 것 같아요.
근데 결제 후 응답 자체는 리액트쪽은 안거치고 빽단에서만 이뤄지는게 아닌가요?
URL url = new URL("https://api.tosspayments.com/v1/payments/confirm");
HttpURLConnection connection = (HttpURLConnection) url.openConnection();
connection.setRequestProperty("Authorization", authorizations);
connection.setRequestProperty("Content-Type", "application/json");
connection.setRequestMethod("POST");
connection.setDoOutput(true);
try (OutputStream outputStream = connection.getOutputStream()) {
// JSON 데이터를 바이트 배열로 변환하여 요청에 보내기
ObjectMapper objectMapper = new ObjectMapper();
String jsonRequestBody = objectMapper.writeValueAsString(requestData);
outputStream.write(jsonRequestBody.getBytes(StandardCharsets.UTF_8));
}
int code = connection.getResponseCode();
boolean isSuccess = code == 200;
// 응답 처리
try (InputStream responseStream = isSuccess ? connection.getInputStream() : connection.getErrorStream();
InputStreamReader reader = new InputStreamReader(responseStream, StandardCharsets.UTF_8)) {
// 응답을 TossSavePaymentRequest로 변환
ObjectMapper objectMapper = new ObjectMapper();
TossSavePaymentRequest paymentResponse = objectMapper.readValue(reader, TossSavePaymentRequest.class);
여기서 처리가 되어서 저는 리액트쪽은 완전 상관없다고 생각했어요
/api/confirm/widget 이거 호출했을때 응답이 어떻게 떨어지는지 확인해 보세요.
음 어떤 응답이요?
보내주신 코드 보면 react 에서
const response = await fetch("/api/confirm/widget", {
method: "POST",
headers: {
Authorization: Bearer ${token} ,// Authorization 헤더 추가
"Content-Type": "application/json",
이렇게 /api/confirm/widget 이걸 호출하시는데요.
네 맞습니다
/api/confirm/widget 이 URL 에서 JSON 포맷으로 응답이 안도는게 아닌가 싶습니다.
그떄 응답에는 JSON으로 옵니다
제가 orderId, amount, paymentKey이렇게 3개 보내는데 거기까진 잘오는데
그럼 이건 언제 나오시는 건가요?>
Failed to execute 'json' on 'Response': Unexpected end of JSON input
이거는 토스페이먼츠쪽 API(https://api.tosspayments.com/v1/payments/confirm)호출후 카드번호등 저장하려고 하다가 생긴 오류에요 그전에 카드번호저장안할떄는 오류 발생안했는데
카드쪽 추가하다가 오류가 발생했습니다
카드 번호 저장을 java 에서 하시나요?
네네
정확히 어떤 자바 코드에서 에러나는지 확인 부탁드립니다.
자바에서는 특별한 에러가 없는 것 같아서요
그럼 리엑트는 어떤 라인에서 에러나시는 건가요?
const json = await response.json(); 여기서에러나시는 건가요?
프론트쪽에서 잠시만요 const response = await fetch("/api/confirm/widget", {
여기서 에러납니다
네 그래서
/api/confirm/widget 이 URL 에서 JSON 포맷으로 응답이 안도는게 아닌가 싶습니다.
이렇게 말씀드린거에요.
그러면 이쪽을 수정해야하는거죠?
어디쪽을 수정해야할지 모르겠어서요
양쪽을 하나씩 디버깅 해봐야겠지만 문제는 java쪽일 것 같아요. 현재 java에서 에러는 발생안하지만 응답값이 json 형태가 아닐 확률이 높습니다.
처음부터 계속 같은 답변을 드리고 있는데요. 내용을 천천히 읽어보시고 하나씩 디버깅 해보시면 답을 찾으실 수 있을거에요.
넵 감사합니다
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.