Ffltter Web:使用HtmlElementView、IFrameElement、RegisterViewFactory实施的解决方案在iOS中不起作用 [英] Flutter Web: Implemented solution using HtmlElementView, IFrameElement, registerViewFactory is not working in ios

查看:0
本文介绍了Ffltter Web:使用HtmlElementView、IFrameElement、RegisterViewFactory实施的解决方案在iOS中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经实现了一个解决方案,将在线支付网关集成到我的Ffltter Web项目中,到目前为止,除了这个解决方案,我还没有找到任何其他解决方案。我在颤动网络项目中实现的解决方案的链接是This作为参考,现在的问题是,这在Android网络上运行得很好,但在iOS网络上却不起作用,我不知道为什么。 有没有人能帮我解释一下这是怎么回事,或者为什么它在iOS中不起作用?或者在Ffltter 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();

这篇关于Ffltter Web:使用HtmlElementView、IFrameElement、RegisterViewFactory实施的解决方案在iOS中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆