New Window Pop not working in iOS flutter_inappwebview while doing Payment from RazorPAY

Question

Here Im using a web URL for RazorPay payment. There is razorpay_plugin but due to some requirement I want to integrate from Web URL. For WebView im using in flutter_inappwebview plugin. In android, Razor Pay test mode is poping up the new window and shows Success and Failure option

But for iOS the Web URL is not opening in new popup window.

Added these permission in Info.plist

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsLocalNetworking</key>
        <true/>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
        <key>NSAllowsArbitraryLoadsInWebContent</key>
        <true/>
    </dict>

but still not working.

Here is the Code.

class SomeScreen extends StatefulWidget {
  final String url;
  const SomeScreen({Key? key, required this.url}) : super(key: key);

  @override
  _SomeScreenState createState() => _SomeScreenState();
}

class _SomeScreenState extends State<SomeScreen> {
  InAppWebViewController? _webViewController;
  InAppWebViewController? _webViewPopupController;
  late String url;
  final options = InAppWebViewGroupOptions(
    crossPlatform: InAppWebViewOptions(
        javaScriptCanOpenWindowsAutomatically: true,
        javaScriptEnabled: true,
        useOnDownloadStart: true,
        useOnLoadResource: true,
        preferredContentMode: UserPreferredContentMode.MOBILE,
        useShouldOverrideUrlLoading: true,
        mediaPlaybackRequiresUserGesture: true,
        allowFileAccessFromFileURLs: true,
        allowUniversalAccessFromFileURLs: true),
    android: AndroidInAppWebViewOptions(
      supportMultipleWindows: true,
    ),
    ios: IOSInAppWebViewOptions(
      allowsAirPlayForMediaPlayback: true,
      suppressesIncrementalRendering: true,
      ignoresViewportScaleLimits: true,
      selectionGranularity: IOSWKSelectionGranularity.DYNAMIC,
      isPagingEnabled: true,
      enableViewportScale: true,
      sharedCookiesEnabled: true,
      automaticallyAdjustsScrollIndicatorInsets: true,
      useOnNavigationResponse: true,
      allowsInlineMediaPlayback: true,
    ),
  );

  @override
  void initState() {
    super.initState();
    url = widget.url;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Container(
          child: InAppWebView(
            initialUrlRequest: URLRequest(url: Uri.parse(widget.url)),
            initialOptions: options,
            onWebViewCreated: (InAppWebViewController controller) {
              _webViewController = controller;
            },
            iosOnNavigationResponse: (controller, response) async {
              return IOSNavigationResponseAction.ALLOW;
            },

            onLoadStart: (controller, Uri? uri) {
              print("Load Started: $uri");
            },
            onCreateWindow: (controller, createWindowRequest) async {
              showDialog(
                context: context,
                builder: (context) {
                  return AlertDialog(
                    content: SizedBox(
                      width: MediaQuery.of(context).size.width,
                      height: 400,
                      child: InAppWebView(
                        // Setting the windowId property is important here!
                        windowId: createWindowRequest.windowId,
                        initialOptions: options,
                        onWebViewCreated: (InAppWebViewController controller) {
                          _webViewPopupController = controller;
                        },

                        onLoadStart:
                            (InAppWebViewController controller, Uri? url) {
                          print("onLoadStart popup $url");
                        },
                        onLoadStop:
                            (InAppWebViewController controller, Uri? url) {
                          print("onLoadStop popup $url");
                          
                        },
                      ),
                    ),
                  );
                },
              );

              return true;
            },
          ),
        ),
      ),
    );
  }

}

Answer 1

const data = {
      callback_url: '<Callback URL>',
      redirect: true,
      amount: 50000,
      email: 'sanjaya@example.com',
      contact: '9123456780',
      order_id: 'order_<order_hash>',
    };

Add a "redirect: true" in your params in razorpay. If you are using webview then you need to add in backend side. And if you using SDK then you need to call predefine method with this parameters. Thanks