如何在同一个inappwebview中打开弹出窗口？
如何在同一个inappwebview中打开弹出窗口？
提问于 2021-10-03 10:23:02
我已经集成了RazorPay自定义检查，在这里，我为良好的UX创建了一个自定义设计。
我将在inappwebview中打开这个定制的web应用程序，一个颤振的插件。这个web应用程序正在正确地打开，但是一旦Razorpay的SDK函数createPayment(data)运行，它就会打开一个窗口弹出。这个弹出窗口现在在webview中不可见。
调用webview的颤振代码：
@override
Widget build(BuildContext context) {
return WillPopScope(
onWillPop: _handleBackPress,
child: SafeArea(
child: Scaffold(
body: InAppWebView(
initialUrlRequest: URLRequest(
url: Uri.parse(Strings.checkoutUrl),
),
initialOptions: InAppWebViewGroupOptions(
crossPlatform: InAppWebViewOptions(
clearCache: true,
javaScriptCanOpenWindowsAutomatically: true, // I thought this will help, but not working
mediaPlaybackRequiresUserGesture: false,
),
android: AndroidInAppWebViewOptions(useHybridComposition: true),
ios: IOSInAppWebViewOptions(allowsInlineMediaPlayback: true),
),
onWebViewCreated: (controller) async {
_controller = controller;
_controller.clearCache();
_controller.addJavaScriptHandler(
handlerName: 'PaymentHandle',
callback: (data) {
// ... Will do somthing
},
);
},
onLoadStop: (_, __) async {
await _controller.evaluateJavascript(source: '''
window.parent.postMessage(${widget.paymentJsonData}, "*");
''');
},
),
),
),
);
}调用createPayment()的代码:当用户单击按钮时，将在webapp上调用此函数。
async makePayment() {
try {
const data = {
callback_url: '<Callback URL>',
redirect: true,
amount: 50000,
email: 'gaurav.kumar@example.com',
contact: '9123456780',
order_id: 'order_<order_hash>',
method: 'upi',
upi: {
vpa: this.vpa, // Fetch from input field
flow: 'collect,',
},
};
window.rz.createPayment(data);
window.rz.focus(); // Found in RazorPay's document to bring the window in focus. Not working on Webview
} catch (e) {
console.error(e);
}
},PS - RazorPay的初始化工作正常。我们在浏览器上单独运行Webview。弹出窗口正在打开correclty
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-10-11 16:25:16
如果您不想在单独的窗口中打开重定向URL。在Razorpay的全局配置中，您必须传递redirect: true，而不是在传递给createPayment()方法的data对象中传递它；
this.configOptions = {
key: process.env.VUE_APP_API_KEY,
redirect: true,
...
};
// eslint-disable-next-line no-undef
window.rz = new Razorpay(this.configOptions);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69423930
复制相关文章
相似问题
腾讯云开发者
