[브랜드페이][flutter]연결료청 초과 및 아이폰으로 접속시에 callback 받지 못하는 이슈
브랜드페이를 flutter - ios로 개발 및 테스트를 하고 있습니다.
flutter 로 개발하고 카드 추가를 위해 inappwebview를 이용하여 웹으로 토스에서 제공하는 UI를 띄오고자 하였습니다.
웹은 React로 간략히 개발하였고, 기타 결제 및 기타 요청을 위해 local server를 이용하여 api로 호출하고 있습니다.
문제:
문제는 아이폰에서 웹뷰를 통해 리액트에서 카드요청을 할때 loadBrandPay를 통해 초기화 해주고 해당 객체를 통하여
addPaymentMethod 함수를 실행하려고 하였습니다.
이때 loadBrandPay에서 callback router로 들어와야 하는데 그렇지 못하고있습니다. 아마도 아이폰이나 플러테에서 막는것 같습니다.
사전에 매니저님과 대화하여 토스서버에서 callback 요청이 이루어지지 않음을 확인하였습니다.
이런 상황에서 개발컴퓨터 크롬으로 리액트에 접속하면 callback도 잘 이뤄지고 카드 추가 UI 가 잘 뜹니다..
플러터 웹뷰에서만 안되고 있어서 좀 답답한 상황입니다.
혹시 해당 내용에 의견이 있으시다면 어떤거라도 말씀해 주시면 감사할 것 같습니다.
앱 - flutter
brandPay - react
callbakc 및 api - nodejs & express server
앱으로 접속할경우,
TimeoutError: 요청 시간을 초과했습니다. 다시 시도해주세요.
This method should not be called on the main thread as it may lead to UI unresponsiveness.
이런 오류들이 보이고 있습니다...
ios의 경우 plist.info 에서 http도 허용 하였습니다..
Allow Arbitrary Loads = true
Allow Arbitrary Loads in Web Content =true
감사합니다.33 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
안녕하세요
메일받고 디스코드로 오신거 맞으실까요?
inappwebview에 띄우는 react 소스가, 웹서버에 있나요? 아니면 flutter 소스코드에 포함되어있나요?
네 안녕하세요 넵 맞습니다. 메일로는 확인이 더 어렵다고 사셔서 이리로 왔어요 ㅠ..
react는 따로 있습니다.
create-react-app으로 작성하였습니다.
웹서버에 있다는 말씀이시죠?
넵 그렇습니다. localhost:3000으로 보통 들어가니까요 ..
redirect url로 등록한 주소 한번 말씀해주시겠어요?
💡 정보 제출
아래 버튼을 눌러 외부로 노출되기 민감한 정보를 제출해주세요
xoneto99#3251
정상적으로 제출되었습니다.
보내주신 주소가 인터넷망으로 접근가능한 주소인거죠?
Flutter에서 웹뷰 렌더링 할 때, 브랜드페이 영역 외에는 잘 보여지나요?
네, 맞습니다. 제가 컴퓨터로 크롬을 열어서 localhost:3000으로 또는 해당 ip주소 : 3000 으로 접속하면 접속은 잘 됩니다 ...
또한 웹뷰에서 렌더링 할때 말씀하는 대로, 브랜드 페이 이외의 영역은 잘 보여집니다.
즉, 제가 리엑트로 컴포넌트 작성시에는 잘 렌더링됩니다...
아 지금 로컬서버에 올라가있는건가요?
네 맞습니다.
그럼flutter에 안올리고, react자체에선 잘 되시겠네요
네 그냥 리엑터에서, 아이폰 개발자용 앱 접속이 아니라,
컴퓨터에서 웹으로 -크롬 으로 해당 ip로 접속하면 토스에서 제공하는 UI가 다 뜨게 됩니다.
제가 이부분이 이해가 안가서 ㅡㅡ....
이런경우 http를 아이폰에서 security 로 막으면 그럴때가 있다고 알고 있는데, 그것도 ture로 plist에서 설정하였고... 하여 ...제가 길을 잃은 중입니다 .ㅠ.ㅠ
localhost에서 돌려서 그런 것 같습니다... flutter에서 redirectUrl받으려고 하는데, flutter에서 호출했을 시에는 localhost:3000에는 아무것도 없어서요
음...제가 이해력이 부족하여 ....어떤 뜻인지 잘 이해가 가지 않네요 ㅠ
현재 flutter앱 바로 실행하실 수 있는 상황이신가요?
소스코드 수정 후 실행
네네
웹뷰에서 위에 실행해보시겠어요
flutter
url확인하면 메세지 남겨주세요
네 알겠습니다.
어....뜨네요...
어....오...?
해당 Url은 지웠습니다.
뜨는게 확인되셔서요
네네
react를 로컬에 돌린 후, flutter에 띄우지 마시고
웹서버에 올린후 flutter에 띄워주세요.
아 실제 웹서버 말씀하시는 거지요? 가령 aws같은?
네.
하...그렇군요... 알겠습니다. 감사합ㄴ디ㅏ.
감사합니다.
혹시 아까 말씀하신 flutter에서
localhost:3000을 호출하는데 없어서 그렇다고 하신 말씀
혹시 조금더 설명이 가능할까요 ?
Localhosts는 해당 로컬 서버를 돌리는 컴퓨터에서 돌아가는 환경입니다.
네
해당 기기 외에 다른 기기에서 접근시 정상적이지 않을 수 있어요
음 그런가요 ,
더 자세한건 내부 로직이라 모르겠지만. 일단 대충을 알겠습니다.
감사합니다.!
그래도 실마리를 주셔서 너무너무 감사합니다.
네 수고하세요
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.
감사합니다!!