Flutter Webview에서 Javascript SDK 연동할 수 있는 방법이 있나요?
모바일 웹뷰 환경에서 javascript SDK를 활용해서 결제를 시도하면, "모바일 화면에서는 Promise 방식을 지원하지 않습니다." 에러가 표시됩니다.
아래는 flutter_webview 패키지를 사용하여 결제를 시도한 코드입니다.
아래는 flutter_webview 패키지를 사용하여 결제를 시도한 코드입니다.
// 카스텀 웹뷰 widget을 포함하는 widget
class TossPayment extends StatelessWidget {
final Widget? initialChild;
final String clientKey;
final PaymentData? data;
final callback;
final Set<Factory<OneSequenceGestureRecognizer>>? gestureRecognizers;
TossPayment({
Key? key,
this.initialChild,
required this.clientKey,
required this.data,
required this.callback,
this.gestureRecognizers,
}) : super(key: key);
@override
Widget build(BuildContext context) {
var redirectUrl = UrlData.redirectUrl;
return TossPaymentsWebView(
type: ActionType.payment,
initialChild: this.initialChild,
gestureRecognizers: this.gestureRecognizers,
executeJS: (WebViewController controller) {
controller.runJavascript('''
var tossPayments = TossPayments("${this.clientKey}");
tossPayments.requestPayment("카드", ${jsonEncode(this.data?.toJson())})
''');
},
customPGAction: (WebViewController controller) {
return null;
},
useQueryData: (Map<String, String> data) {
this.callback(data);
},
isPaymentOver: (String url) {
if (url.startsWith(redirectUrl)) {
return true;
}
return false;
},
);
}
}// 카스텀 웹뷰 widget을 포함하는 widget
class TossPayment extends StatelessWidget {
final Widget? initialChild;
final String clientKey;
final PaymentData? data;
final callback;
final Set<Factory<OneSequenceGestureRecognizer>>? gestureRecognizers;
TossPayment({
Key? key,
this.initialChild,
required this.clientKey,
required this.data,
required this.callback,
this.gestureRecognizers,
}) : super(key: key);
@override
Widget build(BuildContext context) {
var redirectUrl = UrlData.redirectUrl;
return TossPaymentsWebView(
type: ActionType.payment,
initialChild: this.initialChild,
gestureRecognizers: this.gestureRecognizers,
executeJS: (WebViewController controller) {
controller.runJavascript('''
var tossPayments = TossPayments("${this.clientKey}");
tossPayments.requestPayment("카드", ${jsonEncode(this.data?.toJson())})
''');
},
customPGAction: (WebViewController controller) {
return null;
},
useQueryData: (Map<String, String> data) {
this.callback(data);
},
isPaymentOver: (String url) {
if (url.startsWith(redirectUrl)) {
return true;
}
return false;
},
);
}
}
