안녕하세요. flutter로 결제창 연동하고있는 개발자입니다.
웹뷰로 결제창 띄우는 flutter web을 개발하고있는데요
안드로이드는 모바일에서 잘되고, ios는 안되네요.
스키마 문제같은데 왜 차이가 생기는거며 해결방법이 뭔가요?
44 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
💡 정보 제출
아래 버튼을 눌러 외부로 노출되기 민감한 정보를 제출해주세요
메일주소 남겨주시면 가이드 보내드릴게요
입니다!
발송되었습니다.
확인했습니다.
가이드 문서가 네이티브앱에 관해서 있는데
flutter web 인 경우는 없을까요?
플러터 웹이라고 하시는게 어떤 의미이실까요?
플러터 웹뷰를 말씀하시는 건가요?
구동환경이
flutter web 입니다
따로 android application으로 배포를 안하고 웹호스팅형식입니다
플러터 웹에서 외부 script 를 import 해서 실행 가능하시다면 일반 가이드에 있는 내용으로 진행하시면 될것 같구요.
그럼 ios에서 왜 외부앱이 실행안될까요
안드로이드는 실행이 잘됩니다
결제창 -> 외부앱 실행 이부분이 막힙니다. ios 크롬, 사파리에서
앱이 설치 되어 있는 상태에서 해당 앱이 실행되지 않으시는 건가요?
네
개발자 도구의 콘솔이나 네트워크 탭에 별도의 에러는 없으신가요?
@jihun.bang 웹뷰 띄우기 위해 사용하시는 함수가 어떻게 되세요?
잠시만요
lauchUrl 등..
모바일 브라우저에서 별도의 에러는 안나오고있습니다
이렇게 코드 짜져있습니다.
만드신 웹사이트에 저희가 접근해볼 방법은 없을까요?
ios 환경 모바일로 위 주소 접속하셔서 상품 -> 구매 하시면 됩니다

저렇게 처리중팝업이 열렸다 닫힙니다@
모든 카드사가 다 그런가요?
네 안드로이드 모바일 브라우저에선 잘됩니다
우리은행 외에 다른 카드사도 그렇단 말씀잇지ㅛ?
넵
외부 앱연동관련된 버튼이 모두 무반응입니다
지금 캡처화면 위에 주소창에 있는 주소는 귀사의 URL 주소인거죠?
즉 귀사의 화면내 웹뷰를 띄워 우리은행 창이 떠있는 상황이 맞나요?
저 주소는 임시 주소이긴한데 실제 호스팅된 서버와 동일합니다


네 이화면 맞습니다
제가 캡처해드린 화면은 안드로이드 화면이긴 하지만 원리만 말씀드릴게요
네
원래 모바일 화면에서는 브라우저에서 토스페이먼츠 checkout page로 redirect된 후, 해당 페이지에서 카드사 선택 및 외부앱까지 이동하게 됩니다.
그런데 귀사의 화면을 보니, 토스페이먼츠 checkout page가 브라우저가 아닌 flutter웹뷰 내에서 보여지는 것으로 확인됩니다.
원래 모든 safari, chrome등 브라우저는 별도의 처리 없이도 외부앱이 정상적으로 실행할 수 있으나.
사용 중인 웹뷰에서는 외부앱을 실행하지 못하는 것으로 보입니다.
브라우저 창 자체가 checkout page 로 redirect되도록 처리 가능한지 확인해주세요
더불어 웹뷰를 그대로 사용하며 예상되는 해결 방안으로는 (저희도 flutter web 히스토리가 없어 확실하지 않습니다.)
귀사에서 사용중인 웹뷰 패키지(webviewx)가 화이트리스트 방식으로 기존에 등록되어 있는 앱스킴만 실행시킬 수 있습니다.
앱스킴을 등록가능한지 확인 요청드립니다. (ios build하는게 아니라 가능할지 모르겠네요) https://docs.tosspayments.com/guides/webview#1-%EC%95%B1-%EC%8A%A4%ED%82%B4-%EB%A6%AC%EC%8A%A4%ED%8A%B8-%EC%B6%94%EA%B0%80%ED%95%98%EA%B8%B0
웹뷰(WebView)에서 외부 앱 열기 | 토스페이먼츠 개발자센터
브라우저가 아닌 모바일 웹뷰로 결제창을 띄울 때 카드사별 결제 수단을 인증하려면 외부 앱(3rd-party 앱)을 연동해야 합니다. 연동에 필요한 외부 앱 스킴(App URL Scheme)목록과 추가 로직을 살펴보세요.
웹뷰 형식이 아닌 다른 페이지로 이동하는 방식으로 결제창 띄우라는 말씀이신거죠?
웹뷰가 아니라 브라우저를 사용해주셔야합니다.
네 시도해보겠습니다 감사합니다
혹시 안드로이드는 왜 되는건지 알수있을까요?
저희도 명확하게 말씀드리기에는 어렵습니다. flutter 웹뷰 를 사용하시는 만큼 디버깅을 하면서 사용해보셔야할 것 같아요
네알겠습니다
이건 별개의 궁금증 때문에 질문드리는건데요!
flutter web으로 구현하시는 이유는 추후 flutter 플랫폼으로 web 및 앱까지 제공하시기 위함이신가요?
네맞습니다
크로스플랫폼으로 개발중입니다
@이실장 @냥과장
리다이렉트 방식으로 모두 성공했습니다 ^^ 감사합니다
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.