Flutter 결제 위젯이 렌더링 안되는 오류
tosspayments_widget_sdk_flutter: ^2.1.1 를 이용해서 결제 위젯을 개발 중입니다.
client key는 테스트 키를 이용하고 있습니다.
PaymentWidget 설정 후 renderPaymentMethods와 renderAgreement 요청으로 렌더링 요청하여 결제 위젯이 잘 렌더링이 됩니다.
다만 특정 상황 이후에 동일하게 렌더링을 진행하려고 하는데 아래와 같은 오류가 발생합니다.
[IOSInAppWebViewController] (iOS) WebView ID 11 calling "onConsoleMessage" using {messageLevel: 3, message: ReferenceError: Can't find variable: PaymentWidget}
[IOSInAppWebViewController] (iOS) WebView ID 12 calling "onReceivedServerTrustAuthRequest" using {protectionSpace: {protocol: https, sslError: {message: Indicates the evaluation succeeded and the certificate is implicitly trusted, but user intent was not explicitly specified., code: 4}, port: 443, sslCertificate: {validNotBeforeDate: null, validNotAfterDate: null, x509Certificate: [48, 130, 5, 226, 48, 130, 4, 202, 160, 3, 2, 1, 2, 2, 16, 13, 222, 234, 140, 162, 48, 36, 143, 100, 45, 9, 10, 64, 227, 20, 55, 48, 13, 6, 9, 42, 134, 72, 134, 247, 13, 1, 1, 11, 5, 0, 48, 60, 49, 11, 48, 9, 6, 3, 85, 4, 6, 19, 2, 85, 83, 49, 15, 48, 13, 6, 3, 85, 4, 10, 19, 6, 65, 109, 97, 122, 111, 110, 49, 28, 48, 26, 6, 3, 85, 4, 3, 19, 19, 65, 109, 97, 122, 111, 110, 32, 82, 83, 65, 32, 50, 48, 52, 56, 32, 77, 48, 52, 48, 30, 23, 13, 50, 53, 48, 52, 49, 55, 48, 48, 48, 48, 48, 48, 90, 23, 13, 50, 54, 48, 53, 49, 54, 50, 51, 53, 57, 53, 57, 90, 48, 29, 49, 27, 48, 25, 6, 3, 85, 4, 3, 12, 18, 42, 46, 116, 111, 115, 115, 112, 97, 121...
30 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
웹콘솔에서는 어떤 에러가 발생하는지 확인 부탁드립니다.
Flutter를 웹으로 빌드한뒤, 웹콘솔 확인을 말씀하신건가요? @today.lastday
네 맞습니다. 에러가 발생했을 때 웹콘솔에서 보이는 에러 확인 부탁드려요.
앱 로그 상으로는 정확한 원인 파악하기 힘들까요?
기존 프로젝트에서 웹 빌드 할 수 있게 설정하려면 시간이 많이 필요해 보여서 여쭤봅니다. @today.lastday
웹으로 빌드하는 것이 아니라 (플루터 웹은 미지원)
앱 내 웹뷰의 로그를 확인해야합니다.
웹뷰 로그 전달 드립니다. @Minsu Kim
의미 있는 로그를 전달해주시기 바랍니다.
저희sdk에서 응답된 에러로그는 없나요?
mid도 알려주세요
해당 로그는 tosspayments_widget_sdk_flutter SDK의 위젯에서 반환되는 로그입니다.
또한 전자결제 미신청 상태로 https://docs.tosspayments.com/guides/v2/payment-widget/integration 에서 문서용 테스트 clientKey를 이용하고 있습니다.
연동하기 | 토스페이먼츠 개발자센터
토스페이먼츠의 간편한 결제 연동 과정을 한눈에 볼 수 있습니다. 각 단계별 설명과 함께 달라지는 UI와 코드를 확인해보세요.
sdk에서 반환하는 로그가아니라
웹뷰에서 반환하는 로그입니다.
저희 제품이슈는 아니고
연도 ㅇ이슈로 보여요
[IOSInAppWebViewController] (iOS) WebView ID 11 calling "onConsoleMessage" using {messageLevel: 3, message: ReferenceError: Can't find variable: PaymentWidget}
[IOSInAppWebViewController] (iOS) WebView ID 12 calling "onReceivedServerTrustAuthRequest" using {protectionSpace: {protocol: https, sslError: {message: Indicates the evaluation succeeded and the certificate is implicitly trusted, but user intent was not explicitly specified., code: 4}, port: 443, sslCertificate: {validNotBeforeDate: null, validNotAfterDate: null, x509Certificate:
PaymentWidget
을 찾을 수. ㅓㅂㅅ다는것보니
sdk를 불러오기 전에 (<sciprt src= ...js)
js sdk를 실행하는게 아닌가 싶네요
GitHub
tosspayments-sample-v1/payment-widget/flutter at main · tosspaymen...
토스페이먼츠 SDK v1 샘플 프로젝트입니다. . Contribute to tosspayments/tosspayments-sample-v1 development by creating an account on GitHub.
샘플 참고하셔서 한번 테스트해보시기 바랍니다.
현재 발생하는 오류 현상 구현 방식입니다.
코드의 변환는 없이 오류가 발생합니다.
flutter version: 3.32.1
dart version: 3.8.1
테스트 기기: xcode simulator
오류 발생 흐름
ㄴ 1. 코드 구현 (첨부한 코드)
ㄴ 2. simulator 실행 --> 결제 위젯 정상 작동
ㄴ 3. simulator 종료
ㄴ 4. simulator 재실행 --> 결제 위젯 미작동

위에 링크올려드린 github샘플
그대로 실행한건가요?
아닙니다.
샘플에 있는 코드 중에서 결제 위젯 호출하는 부분만 제 프로젝트에 적용했습니다
우선 저희도 처음 보는 현상이고 flutter는 앱 환경마다 동작방식이 너무 다릅니다.
이에 샘플 그대로 한번실행해서 확인바랍니다.
웹뷰가 던지는 오류 기반으로 디버깅해보셔도되고요
샘플 그대로 실행 시 정상 작동되나요?
제가 실행했을 때는 첫 실행 시, 결제 위젯 렌더링 하게 되면 앱이 죽는 현상이 발생하고,
다시 실행해서 렌더링 시도 시에는, 렌더링 되지 않는 오류가 발생합니다.
샘플은 정상 작동하는것이 검증된 파일입니다.
"Flutter / iOS simluator 에서 widget 랜더링이 되지 않습니다." 라는 포스트에서도 동일한 오류 현상 문의가 있습니다.
해당 오류가 최신 Flutter 버전에서 발생하는 것인지, 최신 버전에서 샘플을 실행하여 확인해주실 수 있을까요?
포스트 링크주세요
저기서도 해결안됬네요
우선 저희 당장 샘플 확인 어렵습니다.
[IOSInAppWebViewController] (iOS) WebView ID 11 calling "onConsoleMessage" using {messageLevel: 3, message: ReferenceError: Can't find variable: PaymentWidget}
[IOSInAppWebViewController] (iOS) WebView ID 12 calling "onReceivedServerTrustAuthRequest" using {protectionSpace: {protocol: https, sslError: {message: Indicates the evaluation succeeded and the certificate is implicitly trusted, but user intent was not explicitly specified., code: 4}, port: 443, sslCertificate: {validNotBeforeDate: null, validNotAfterDate: null, x509Certificate:
이오류로 디버깅해보시기 바랍니다.
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.
해당 오류는 tosspayments_widget_sdk_flutter 에서 사용하는 flutter_inappwebview 패키지에서 반환하는 로그같습니다.
제 프로젝트에서 반환하는 로그가 아닙니다.
실행하는 프로젝트에서 코드 변화 없이 simulator를 다시 실행하기만 해도 발생하는 오류로 저희가 직접 디버깅을 할 수 있는지 모르겠네요
저말고도 다른 프로젝트에서도 발생하는 문제이니 지속적인 원인 파악을 부탁드립니다.
ㅇㅠ선 실제 디바이스에서도 한번 확인해주시기 바랍니다.
실제 기기에서는 정상 작동하는 것 같습니다.
그럼 아래에러가 시뮬레이터와 관련이 있는 것. ㅏㅌ네요
[IOSInAppWebViewController] (iOS) WebView ID 12 calling "onReceivedServerTrustAuthRequest" using {protectionSpace: {protocol: https, sslError: {message: Indicates the evaluation succeeded and the certificate is implicitly trusted, but user intent was not explicitly specified., code: 4}, port: 443, sslCertificate: {validNotBeforeDate: null, validNotAfterDate: null, x509Certificate:
해당 에러로그 기반으로 검증해보시면 좋을 것. ㅏㅌ습니다.
알겠습니다.
해당 에러 로그가 토스페이먼츠 SDK에서 사용하는 "flutter_inappwebview" 패키지에서 발생하는 로그로 보입니다.
비슷한 오류 로그가 해당 패키지 이슈에 올라와있어 공유드립니다.
https://github.com/pichillilorenzo/flutter_inappwebview/issues/1669
확인 후 토스페이먼츠 SDK 에서 수정이 가능하면 수정 부탁드리겠습니다.
GitHub
[iOS] SSL Error handling when loading site with "bad" certificate ...
I have read the Getting Started section I have already searched for the same problem Environment Technology Version Flutter version 3.3.10 Plugin version 6.0.0-beta.22 Android version - iOS version...
공유 감사합니다. 내부적으로도 확인해볼게요
감사합니다.