我已经实现了一个解决方案，在我的flutter web项目中集成了一个在线支付网关，直到现在我还没有找到任何其他的解决方案，除了这个。解决方案的链接，我已经在我的扑动网络项目实施是这供参考，现在的问题是，这在安卓网络工作得很好，但它不是在iOS网络工作，我不知道为什么。谁能告诉我这个问题是什么，或者为什么它不能在iOS中工作?，或任何其他在flutter web中实现支付网关的解决方案。
下面是我从那篇文章中实现的代码。UiFake.dart
import 'dart:ui' as ui;
// ignore: camel_case_types
class platformViewRegistry {
static registerViewFactory(String viewId, dynamic cb) {
ui.platformViewRegistry.registerViewFactory(viewId, cb);
}
}
web/payment.html
<!DOCTYPE html><html>
<meta name="viewport" content="width=device-width">
<head><title>RazorPay Web Payment</title></head>
<body>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>
var options = {
"key": "YOUR_KEY_HERE",
"amount": "50000", "currency": "INR",
"name": "Acme Corp",
"description": "Test Transaction",
"image": "https://example.com/your_logo",
"handler": function (response){
window.parent.postMessage("SUCCESS","*"); //2
alert(response.razorpay_payment_id);
alert(response.razorpay_order_id);
alert(response.razorpay_signature)
},
"prefill": {
"name": "Gaurav Kumar",
"email": "gaurav.kumar@example.com",
"contact": "9999999999"
},
"notes": {
"address": "Autofy"
},
"theme": {
"color": "#DF0145"
},
"modal": {
"ondismiss": function(){
window.parent.postMessage("MODAL_CLOSED","*"); //3
}
}
};
var rzp1 = new Razorpay(options);
window.onload = function(e){ //1
rzp1.open();
e.preventDefault();
}
</script>
</body>
</html>
RazorPayWeb.dart
import 'dart:html';
import 'dart:ui' as ui;
//conditional import
import 'package:autofystore/utils/UiFake.dart' if (dart.library.html) 'dart:ui' as ui;
import 'package:flutter/material.dart';
class RazorPayWeb extends StatelessWidget {
@override
Widget build(BuildContext context) {
//register view factory
ui.platformViewRegistry.registerViewFactory("rzp-html",(int viewId) {
IFrameElement element=IFrameElement();
//Event Listener
window.onMessage.forEach((element) {
print('Event Received in callback: ${element.data}');
if(element.data=='MODAL_CLOSED'){
Navigator.pop(context);
}else if(element.data=='SUCCESS'){
print('PAYMENT SUCCESSFULL!!!!!!!');
}
});
element.requestFullscreen();
element.src='assets/html/payment.html';
element.style.border = 'none';
return element;
});
return Scaffold(
body: Builder(builder: (BuildContext context) {
return Container(
child: HtmlElementView(viewType: 'rzp-html'),
);
}));
}
}
谢谢你。
注释掉requestFullscreen():
//element.requestFullscreen();