브랜드페이 redirectUrl 오류
클라이언트: localhost:3000(리액트)
백엔드 : localhost:8090(노드)인데
리액트에서
const brandpay = tossPayments.brandpay({
customerKey,
redirectUrl: "http://localhost:8090/api/auth/brandpay-callback",
});
백엔드 주소로 리다이렉트 걸면 cors에러가 나서
redirectUrl을 클라이언트주소로 걸었는데
아래와같은 에러가납니다.
개발자센터 브랜드페이 리다이렉트 URL에는 등록된상태입니다.
17 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
해당 주소에서 토큰은 발급받으시나요
const brandpay = tossPayments.brandpay({
customerKey,
redirectUrl: "http://localhost:3000/toss",
});
localhost:3000/toss에서 랜딩되자마자 토큰 발급하게 해놨는데
설정한 redirectUrl로 넘어가질 않아서
토큰발급이 안되고 계속
POST https://api.tosspayments.com/v1/brandpay/clients/authorizations 429 (Too Many Requests) 이렇게뜹니다
토큰 발급 응답은 정상응답 받으셨나요?
저희쪽 로그상으로는 토큰 발행 요청 이력이 없습니다.
토큰 발급요청하시고 받은 응답을 공유해 주세요.
redirectUrl를 클라이언트 주소(localhost:3000/toss)로 설정하면
localhost:3000/toss 페이지로 아예 호출이 되질 않아서
현재 토큰 발급이 불가합니다.
redirectUrl를 백엔드로 하면 cors때문에 클라이언트 주소로한건데
페이지 호출이 안되어서 code와 customerKey를 가져올수가 없습니다
1. 상점관리자에 등록된 redirectUrl 을 전부 알려주세요.
2. redirectUrl 에 명시한 주소로 get 으로 접근이 있을거고, 그때 쿼리파람에 전달된 값을 parse 해서 access code 발급 API 호출이 되도록 구현 하는 구조인데, 이렇게 구현한게 맞는지 해당 부분 소스 공유 해주세요.
말씀하신것처럼
redirectUrl로 http://localhost:3000/toss로 설정하여
http://localhost:3000/toss로 들어오면 파라미터 값을 파싱해서
토큰 발급 API 호출하는 구조입니다.
ex) http://localhost:3000/toss?code='111'&customerKey='1234' 이렇게 url로 들어가면 호출되면서 console.log는 찍히는데
redirectUrl로는 해당 url이 호출되지 않아 토큰발급이 불가합니다.
http://localhost:3000/toss?code='111'&customerKey='1234' 이렇게 url로 들어가면 호출된다라는 의미가,
redirectUrl get 으로 잘 호출 되었다는 의미로 이해 됩니다.
그 이후 param parse 후 에 access token 발급을 정상적으로 수행하지 못하시는것 같고요
http://localhost:3000/toss?code='111'&customerKey='1234'이걸 크롬 url로 직접 들어가면 api호출이 되는데
카드등록후에 redirectUrl로는 저 url로 넘어가지 않습니다.
혹시 해당 페이지에서 redirect 해서 다른 페이지로 넘어가게 하고 계신가요?
redirect 하시면 안됩니다. 그 페이지에서 이동없이 토큰을 요청해야 해요.
아뇨 리다이렉트나 페이지이동 따로 안하고 axios로 토큰 api만 호출하고있습니다.
결제요청 페이지가 localhost:3000 이고
/toss 로 접근 했을때, /toss?code={}&customer ~~~~ 이렇게 get method 로 접근되고
/toss 에서 param parse 하고
그 다음에 parse 한 파람을 어떻게 처리하고 있으신건가요?
node 쪽으로 보내고 있나요?
아니면, 그냥 /toss 쪽으로 get 이력 자체가 없다는 의미 인건가요?
url로 /toss로 접근하면 get방식으로 접근되고
쿼리파라미터를 get해서 node api에 axios로 보내는 로직입니다.
url로 크롬창에 직접 치면 되는데
카드등록후에 redirectUrl로는 저 url로 넘어가지않아 쿼리파라미터를 가져올수없어 토큰 발급API 를 호출할수없습니다.
저희 로그상으로는 redirectURL 을 호출해 드렸어요.
아예 해당 URL 호출하는게 브라우저 개발자 도구에 안보이시나요?
네트워크탭에선 보이는데 파라미터 콘솔이 따로 찍히지는 않습니다. 그게 찍혀야 API 그걸 쿼리스트링으로 보내서 API 호출이 될거같습니다
파라미터 콘솔이라는게 /toss 가 실행되는 위치이신거죠?
네트워크탭에서 쿼리스트링으로 값이 넘어가는게 보이는지 확인해 보시고
보이신다면 /toss endpoint 에서 정상적으로 받아서 처리하시도록 구현부탁드립니다.
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.