빈 팝업과 결제 불가
카드 결제와 관련하여
국민, 카카오, 하나, 우리 등은 잘 되는데
산업, 비씨 등은
"""
아래 확인 버튼을 클릭하시고 팝업차단을 해제하여 주시기 바랍니다.
해제 이후 '페이지 새로고침(F5키)'이 필요할 수 있습니다.
"""
라는 alert가 뜨고
팝업차단을 해제한 후에도 같은 현상이 반복되며 빈 창이 뜹니다
콘솔에는
"""
Error: Failed to load static props
NextJS 14
CancelVPPayment https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2772
getPayMethod https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:768
Ret_sendPay https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2506
onreadystatechange https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2560
sendProc https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2558
MakePayMessage https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:209
NextJS 26
_app-3c834d3f0e6c49d4.js:37:45470
NextJS 10
CancelVPPayment https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2772
getPayMethod https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:768
Ret_sendPay https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2506
onreadystatechange https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2560
(Async: EventHandlerNonNull)
sendProc https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:2558
MakePayMessage https://www.vpay.co.kr/eISP/Wallet_mix_layer_VP.js:209
"""
라는 에러가 뜨고요
9 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
Cross-Origin Read Blocking (CORB) blocked a cross-origin response. 문제인 것 같습니다. 다른 분들은 해당 문제를 어떻게 해결하시는지 궁금합니다.
만드신 페이지의 header 에 CORS 나 CORB 헤더가 있으실겁니다.
그걸 삭제해 주시면 되요.
SECURE_CROSS_ORIGIN_OPENER_POLICY 보통 이런 헤더가 문제가 됩니다.
위젯이 특정 환경에서 일부 카드사의 결제창을 렌더링하지 못하는 문제인데, 저희 서버쪽 설정을 변경해서 고칠 수 있는 문제인지요. 참고로 문제가 있는 카드사들도 모바일로 결제할땐 잘 되지만(카드사 결제앱 연동) 데스크탑 환경에서만 발생하는 문제입니다. 위젯을 여러 사람들이 쓰고 있으니 잘 안 되는 부분이 있다면 당연히 저희쪽 문제라고 생각하지만 이해가 가지 않는 부분이기에 마지막으로 작은 힌트라도 얻어볼 수 있기를 바랍니다.ㅠㅠ 바쁘신 와중에 답변 감사합니다.
네 그게 귀사 서버의 보안 설정이 너무 강력해서 그런것이라
설정을 바꾸면 대부분 해결되세요.
해결했습니다. 혹시 차후에 같은 문제로 검색하실 분들을 위해 기록 남겨둡니다.
문제: 데스크탑 환경에서 결제 버튼을 클릭한 후 팝업이 뜨는 일부 카드사의 위젯 결제창이 렌더링되지 않는 문제
원인: response header의 cross-origin-opener-policy값이 same-origin으로 되어 있음
해결: same-origin을 same-origin-allow-popups로 바꿈
냥과장님, 이안님 감사합니다
권장드리는 바로는 그 헤더를 없애는겁니다.
추후 BC계열 ISP 결제에서 오류가 발생할 수 있어서요.
이안님 조언대로 해당값 unsafe-none으로 변경했습니다
MDN문서에 따르면(https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Opener-Policy) unsafe-none이 브라우저 디폴트 값이라고 하는데요. 파이썬 장고 5.2 버전 기준으로 시큐리티 미들웨어에서는 same-origin이 디폴트 입니다. (https://docs.djangoproject.com/en/5.2/ref/middleware/#cross-origin-opener-policy)
혹시 다른 분들께 나중에 참조가 될까 싶어 남깁니다.
감사합니다
MDN Web Docs
Cross-Origin-Opener-Policy - HTTP | MDN
The HTTP Cross-Origin-Opener-Policy (COOP) response header allows a website to control whether a new top-level document, opened using Window.open() or by navigating to a new page, is opened in the same browsing context group (BCG) or in a new browsing context group.
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.